/* FINAFRANSAR MEMBERSHIP – Loyalty + Community. Mobile-first, scoped under .fp
   so it never touches the theme. Blush, cream and rose; serif headings. */
.fp, .fp-sheet, .fp-toast {
  --ink: #2b2321;
  --ink-2: #5a4d49;
  --muted: #7a6b66;
  --line: #eddcd6;
  --bg: #f8efeb;
  --card: #fffaf8;
  --rose: #c98f98;
  --rose-d: #8f4f5c;
  --rose-l: #f3dfe0;
  --dark: #211b1a;
  --gold: #b8913a;
  --bronze-bg: linear-gradient(135deg, #e9c3ad, #d39a7c); --bronze-ink: #6f3f26;
  --silver-bg: linear-gradient(135deg, #eef0f3, #c9ccd3); --silver-ink: #4a4e57;
  --gold-bg: linear-gradient(135deg, #f6e5b6, #d9b45f); --gold-ink: #6b4f12;
  --serif: "Cormorant Garamond", "Playfair Display", Georgia, "Times New Roman", serif;
  --sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --r: 18px;
  --ease: cubic-bezier(.2, .7, .2, 1);
  --nav-h: 64px;
  color: var(--ink);
  font-family: var(--sans);
  font-size: 15px;
  line-height: 1.45;
  -webkit-font-smoothing: antialiased;
  -webkit-text-size-adjust: 100%;
}
.fp { box-sizing: border-box; width: 100%; max-width: 640px; margin: 0 auto; padding: 0 0 calc(var(--nav-h) + 28px + env(safe-area-inset-bottom)); background: var(--bg); min-height: 100vh; }
.fp *, .fp *::before, .fp *::after, .fp-sheet *, .fp-sheet *::before, .fp-sheet *::after { box-sizing: border-box; }
:where(.fp, .fp-sheet) :where(button) { font: inherit; color: inherit; cursor: pointer; background: none; border: 0; padding: 0; -webkit-tap-highlight-color: transparent; }
:where(.fp, .fp-sheet) :where(input, textarea, select) { font: inherit; color: var(--ink); }
:where(.fp, .fp-sheet) :where(a) { color: inherit; text-decoration: none; }
.fp h1, .fp h2, .fp h3, .fp-sheet h3 { font-family: var(--serif); font-weight: 500; margin: 0; color: var(--ink); letter-spacing: .2px; }
.fp p, .fp-sheet p { margin: 0; }
.fp img { display: block; max-width: 100%; }
.fp-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }

/* boot */
.fp-boot { padding: 90px 0; text-align: center; font-family: var(--serif); letter-spacing: 6px; color: var(--rose-d); }
.fp-boot-line { width: 120px; height: 2px; margin: 18px auto 0; border-radius: 2px; background: linear-gradient(90deg, transparent, var(--rose), transparent); background-size: 200% 100%; animation: fp-shimmer 1.3s linear infinite; }
@keyframes fp-shimmer { to { background-position: -200% 0; } }
.fp-noscript { text-align: center; color: var(--muted); padding: 40px 16px; }

/* ---------- top bar ---------- */
.fp-top { position: sticky; top: 0; z-index: 20; display: grid; grid-template-columns: 88px 1fr 88px; align-items: center; height: 56px; padding: 0 8px; background: rgba(248, 239, 235, .92); backdrop-filter: saturate(1.4) blur(12px); -webkit-backdrop-filter: saturate(1.4) blur(12px); }
.fp-top h1 { text-align: center; font-size: 22px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.fp-top .fp-brand { font-family: var(--serif); letter-spacing: 3px; font-size: 16px; text-transform: uppercase; }
.fp-top h1.has-sub { display: flex; flex-direction: column; align-items: center; line-height: 1.1; min-width: 0; letter-spacing: 2px; font-size: 15px; }
.fp-top .fp-top-sub { margin-top: 2px; font-family: var(--sans); font-size: 11px; letter-spacing: .5px; text-transform: none; color: var(--muted); }
.fp-icon-btn { position: relative; width: 44px; height: 44px; display: grid; place-items: center; border-radius: 50%; }
.fp-icon-btn svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.fp-icon-btn:active { background: rgba(0, 0, 0, .05); }
.fp-dot { position: absolute; top: 8px; right: 8px; min-width: 16px; height: 16px; padding: 0 4px; border-radius: 8px; background: var(--rose-d); color: #fff; font-size: 10px; line-height: 16px; text-align: center; font-weight: 600; }

/* segmented tabs under the top bar */
.fp-tabs { position: sticky; top: 56px; z-index: 19; display: flex; gap: 4px; padding: 0 16px; background: rgba(248, 239, 235, .92); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); border-bottom: 1px solid var(--line); overflow-x: auto; scrollbar-width: none; }
.fp-tabs::-webkit-scrollbar { display: none; }
.fp-tabs button { flex: 1 0 auto; padding: 12px 10px 11px; font-size: 14px; color: var(--ink-2); border-bottom: 2px solid transparent; white-space: nowrap; }
.fp-tabs button.is-on { color: var(--ink); font-weight: 600; border-color: var(--rose-d); }

.fp-page { padding: 14px 16px 0; }
.fp-page > * + * { margin-top: 14px; }

/* ---------- bottom nav ---------- */
.fp-nav { position: fixed; z-index: 40; left: 0; right: 0; bottom: 0; display: flex; justify-content: center; background: rgba(255, 250, 248, .96); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); border-top: 1px solid var(--line); padding-bottom: env(safe-area-inset-bottom); }
.fp-nav-in { display: grid; grid-template-columns: repeat(5, 1fr); width: 100%; max-width: 640px; height: var(--nav-h); }
.fp-nav button { position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px; font-size: 10.5px; color: var(--muted); }
.fp-nav button svg { width: 24px; height: 24px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.fp-nav button.is-on { color: var(--rose-d); font-weight: 600; }
.fp-nav button.is-on svg { stroke-width: 2; }
.fp-nav .fp-dot { top: 6px; right: calc(50% - 20px); }

/* floating create button */
.fp-fab { position: fixed; z-index: 39; right: max(18px, calc(50% - 300px)); bottom: calc(var(--nav-h) + 16px + env(safe-area-inset-bottom)); width: 58px; height: 58px; border-radius: 50%; display: grid; place-items: center; background: linear-gradient(145deg, #d6a2aa, var(--rose-d)); color: #fff; box-shadow: 0 12px 26px -8px rgba(176, 116, 128, .8); }
.fp-fab svg { width: 26px; height: 26px; stroke: #fff; stroke-width: 2; fill: none; stroke-linecap: round; }
.fp-fab:active { transform: scale(.94); }

/* ---------- surfaces ---------- */
.fp-card { background: var(--card); border: 1px solid var(--line); border-radius: var(--r); padding: 16px; }
.fp-soft { background: linear-gradient(160deg, #fbeeea, #f3dcd6); border: 0; }
.fp-muted { color: var(--muted); font-size: 13px; }
.fp-eyebrow { display: block; font-size: 11px; letter-spacing: 3px; text-transform: uppercase; color: var(--rose-d); }
.fp-h2 { font-family: var(--serif); font-size: 22px; }
.fp-section { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin: 22px 0 10px; }
.fp-section h2 { font-size: 13px; font-family: var(--sans); font-weight: 600; letter-spacing: 2px; text-transform: uppercase; color: var(--rose-d); }
.fp-link { color: var(--rose-d); font-size: 13px; font-weight: 600; }

/* buttons */
.fp-btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 46px; padding: 0 22px; border-radius: 999px; background: var(--dark); color: #fff !important; font-size: 13px; font-weight: 600; letter-spacing: 1.5px; text-transform: uppercase; transition: transform .15s var(--ease), opacity .2s; }
.fp-btn:active { transform: scale(.97); }
.fp-btn[disabled] { opacity: .45; pointer-events: none; }
.fp-btn.fp-rose { background: linear-gradient(145deg, #d3a0a8, var(--rose-d)); }
.fp-btn.fp-ghost { background: transparent; color: var(--ink) !important; border: 1px solid var(--line); }
.fp-btn.fp-sm { min-height: 36px; padding: 0 16px; font-size: 11px; }
.fp-btn.fp-wide { width: 100%; }
.fp-chip { display: inline-flex; align-items: center; gap: 6px; height: 34px; padding: 0 14px; border-radius: 999px; background: var(--card); border: 1px solid var(--line); font-size: 13px; color: var(--ink-2); }
.fp-chip.is-on { background: var(--rose-l); border-color: var(--rose); color: var(--rose-d); font-weight: 600; }

/* level pills */
.fp-level { display: inline-flex; align-items: center; height: 22px; padding: 0 10px; border-radius: 6px; font-size: 10px; font-weight: 700; letter-spacing: 1.4px; text-transform: uppercase; white-space: nowrap; }
.fp-level.BRONS { background: var(--bronze-bg); color: var(--bronze-ink); }
.fp-level.SILVER { background: var(--silver-bg); color: var(--silver-ink); }
.fp-level.GULD { background: var(--gold-bg); color: var(--gold-ink); }
.fp-level.lg { height: 30px; padding: 0 14px; font-size: 12px; border-radius: 8px; }

/* avatar */
.fp-av { flex: 0 0 auto; width: 40px; height: 40px; border-radius: 50%; overflow: hidden; background: linear-gradient(145deg, #f0d6d2, #dcb3b0); display: grid; place-items: center; color: #fff; font-family: var(--serif); font-size: 18px; }
.fp-av img { width: 100%; height: 100%; object-fit: cover; }
.fp-av.sm { width: 32px; height: 32px; font-size: 14px; }
.fp-av.lg { width: 96px; height: 96px; font-size: 38px; border: 4px solid var(--bg); }
.fp-av.xl { width: 64px; height: 64px; font-size: 26px; }

/* ---------- home ---------- */
.fp-hello { display: flex; align-items: center; gap: 14px; }
.fp-hello h1 { font-size: 30px; }
.fp-points-card { text-align: center; padding: 24px 18px 22px; }
.fp-points-num { font-family: var(--serif); font-size: 48px; line-height: 1.1; margin: 4px 0 2px; }
.fp-pending { font-size: 12px; color: var(--ink-2); margin-top: 4px; }
.fp-bar { height: 6px; border-radius: 6px; background: rgba(176, 116, 128, .18); overflow: hidden; }
.fp-bar i { display: block; height: 100%; width: 0; border-radius: inherit; background: linear-gradient(90deg, #dcb0b5, var(--rose-d)); transition: width 1s var(--ease); }
.fp-progress-head { display: flex; justify-content: space-between; gap: 10px; font-size: 12px; color: var(--ink-2); margin-bottom: 8px; }
.fp-tiles { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.fp-tile { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; min-height: 92px; padding: 12px 6px; background: var(--card); border: 1px solid var(--line); border-radius: var(--r); font-size: 13px; color: var(--ink-2); text-align: center; }
.fp-tile svg { width: 28px; height: 28px; fill: none; stroke: var(--ink); stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
.fp-strip { display: flex; gap: 8px; overflow-x: auto; scroll-snap-type: x mandatory; margin: 0 -16px; padding: 0 16px 4px; scrollbar-width: none; }
.fp-strip::-webkit-scrollbar { display: none; }
.fp-strip button { flex: 0 0 31%; aspect-ratio: 1; border-radius: 12px; overflow: hidden; scroll-snap-align: start; background: var(--rose-l); }
.fp-strip img { width: 100%; height: 100%; object-fit: cover; }
.fp-level-tile h3 { font-size: 26px; margin: 6px 0 2px; }
.fp-perk { margin-top: 6px; font-size: 14px; color: var(--ink-2); }

/* notices */
.fp-notice { display: flex; gap: 12px; align-items: flex-start; padding: 12px 14px; border-radius: 14px; background: var(--card); border: 1px solid var(--line); }
.fp-notice b { display: block; font-size: 11px; letter-spacing: 2px; text-transform: uppercase; color: var(--rose-d); }
.fp-notice span { font-size: 14px; }
.fp-notice button { margin-left: auto; font-size: 20px; line-height: 1; color: var(--muted); width: 28px; height: 28px; }

/* ---------- community feed ---------- */
.fp-post { background: var(--card); border: 1px solid var(--line); border-radius: var(--r); overflow: hidden; }
.fp-post-head { display: flex; align-items: center; gap: 10px; padding: 12px 12px 8px; }
.fp-post-who { min-width: 0; flex: 1; }
.fp-post-who b { display: block; font-size: 14px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.fp-post-who .fp-level { margin-top: 3px; }
.fp-post-time { font-size: 12px; color: var(--muted); white-space: nowrap; }
.fp-post-body { padding: 10px 14px 4px; font-size: 14.5px; white-space: pre-wrap; word-wrap: break-word; }
.fp-tag { color: var(--rose-d); font-weight: 500; }
.fp-pin { font-size: 11px; color: var(--rose-d); letter-spacing: 1px; text-transform: uppercase; padding: 0 14px 6px; }
.fp-gallery { display: grid; gap: 3px; }
.fp-gallery button { position: relative; overflow: hidden; background: var(--rose-l); }
.fp-gallery img { width: 100%; height: 100%; object-fit: cover; }
.fp-gallery.n1 button { aspect-ratio: 4 / 5; max-height: 560px; }
.fp-gallery.n1 img { object-fit: cover; }
.fp-gallery.n2 { grid-template-columns: 1fr 1fr; }
.fp-gallery.n2 button { aspect-ratio: 3 / 4; }
.fp-gallery.n3 { grid-template-columns: 2fr 1fr; grid-template-rows: 1fr 1fr; aspect-ratio: 4 / 3.2; }
.fp-gallery.n3 button:first-child { grid-row: span 2; }
.fp-gallery.n4 { grid-template-columns: 1fr 1fr; }
.fp-gallery.n4 button { aspect-ratio: 1; }
.fp-more { position: absolute; inset: 0; display: grid; place-items: center; background: rgba(33, 27, 26, .45); color: #fff; font-size: 22px; font-family: var(--serif); }
.fp-product { display: flex; align-items: center; gap: 12px; margin: 10px 12px 0; padding: 8px 10px; border: 1px solid var(--line); border-radius: 12px; background: #fff; }
.fp-product img, .fp-product .ph { width: 44px; height: 44px; border-radius: 8px; object-fit: cover; background: var(--rose-l); flex: 0 0 auto; }
.fp-product div { flex: 1; min-width: 0; font-size: 13px; }
.fp-product b { display: block; font-weight: 500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.fp-product svg { width: 18px; height: 18px; stroke: var(--muted); fill: none; stroke-width: 1.8; }
.fp-actions { display: flex; align-items: center; gap: 4px; padding: 6px 6px 8px; }
.fp-act { display: inline-flex; align-items: center; gap: 6px; min-height: 40px; padding: 0 10px; border-radius: 20px; font-size: 14px; color: var(--ink-2); }
.fp-act svg { width: 23px; height: 23px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linejoin: round; stroke-linecap: round; }
.fp-act.is-on { color: #d4525f; }
.fp-act.is-on svg { fill: #e06b77; stroke: #d4525f; }
.fp-act.save { margin-left: auto; }
.fp-act.save.is-on { color: var(--ink); }
.fp-act.save.is-on svg { fill: var(--ink); stroke: var(--ink); }
.fp-pop { animation: fp-pop .35s var(--ease); }
@keyframes fp-pop { 40% { transform: scale(1.3); } }
.fp-challenge-tag { display: inline-flex; gap: 6px; align-items: center; margin: 0 14px 10px; padding: 4px 10px; border-radius: 999px; background: var(--gold-bg); color: var(--gold-ink); font-size: 11px; font-weight: 600; letter-spacing: .5px; }

.fp-empty { text-align: center; padding: 36px 20px; color: var(--muted); }
.fp-empty b { display: block; font-family: var(--serif); font-size: 22px; color: var(--ink); font-weight: 500; margin-bottom: 6px; }
.fp-loadmore { display: block; margin: 16px auto; }
.fp-skel { height: 320px; border-radius: var(--r); background: linear-gradient(100deg, #f4e6e1 30%, #fbf2ef 50%, #f4e6e1 70%); background-size: 200% 100%; animation: fp-shimmer 1.2s linear infinite; }

/* ---------- comments ---------- */
.fp-comments { padding: 4px 4px 0; }
.fp-cm { display: flex; gap: 10px; padding: 10px 10px 4px; }
.fp-cm.reply { padding-left: 52px; }
.fp-cm-body { flex: 1; min-width: 0; }
.fp-cm-body .who { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; font-size: 13px; font-weight: 600; }
.fp-cm-body p { font-size: 14px; white-space: pre-wrap; word-wrap: break-word; margin-top: 2px; }
.fp-cm-meta { display: flex; gap: 14px; margin-top: 4px; font-size: 12px; color: var(--muted); }
.fp-cm-meta button { font-weight: 600; color: var(--muted); }
.fp-composer { position: sticky; bottom: calc(var(--nav-h) + env(safe-area-inset-bottom)); z-index: 15; display: flex; align-items: flex-end; gap: 8px; margin: 14px -16px 0; padding: 10px 12px; background: rgba(255, 250, 248, .97); border-top: 1px solid var(--line); }
.fp-composer textarea { flex: 1; min-height: 42px; max-height: 120px; padding: 10px 14px; border-radius: 22px; border: 1px solid var(--line); background: #fff; resize: none; font-size: 16px; line-height: 1.35; }
.fp-composer textarea:focus { outline: 2px solid var(--rose-l); border-color: var(--rose); }
.fp-send { flex: 0 0 auto; width: 42px; height: 42px; border-radius: 50%; display: grid; place-items: center; background: linear-gradient(145deg, #d3a0a8, var(--rose-d)); }
.fp-send svg { width: 20px; height: 20px; fill: none; stroke: #fff; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.fp-send[disabled] { opacity: .4; }
.fp-replying { display: flex; justify-content: space-between; align-items: center; margin: 14px -16px -14px; padding: 6px 16px; font-size: 12px; color: var(--ink-2); background: var(--rose-l); }

/* ---------- profile ---------- */
.fp-cover { height: 150px; margin: 0 -16px; background: linear-gradient(160deg, #f1d7d3, #e3bdb9 55%, #d7a8a6); background-size: cover; background-position: center; position: relative; }
.fp-cover::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 50%, rgba(248, 239, 235, .9)); }
.fp-prof { margin-top: -52px; position: relative; z-index: 1; }
.fp-prof h2 { font-size: 28px; margin-top: 8px; }
.fp-prof .handle { color: var(--muted); font-size: 14px; }
.fp-prof .bio { margin-top: 10px; font-size: 14.5px; white-space: pre-wrap; }
.fp-social { display: flex; gap: 10px; margin-top: 14px; }
.fp-social a { flex: 1; display: inline-flex; align-items: center; justify-content: center; gap: 8px; height: 40px; border-radius: 12px; border: 1px solid var(--line); background: var(--card); font-size: 13px; }
.fp-social svg { width: 18px; height: 18px; }
.fp-follow { margin-top: 14px; width: 100%; }
.fp-follow.is-on { background: transparent; color: var(--ink) !important; border: 1px solid var(--line); }
.fp-badges { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 12px; }
.fp-badge { display: inline-flex; align-items: center; gap: 5px; height: 28px; padding: 0 10px; border-radius: 999px; background: var(--card); border: 1px solid var(--line); font-size: 12px; }
.fp-grid3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 3px; margin: 0 -16px; }
.fp-grid3 button { position: relative; aspect-ratio: 1; overflow: hidden; background: var(--rose-l); }
.fp-grid3 img { width: 100%; height: 100%; object-fit: cover; }
.fp-grid3 .txt { padding: 10px; font-size: 12px; text-align: left; color: var(--ink-2); display: -webkit-box; -webkit-line-clamp: 6; -webkit-box-orient: vertical; overflow: hidden; height: 100%; background: linear-gradient(160deg, #fbeeea, #f3dcd6); }
.fp-grid3 .multi { position: absolute; top: 6px; right: 6px; width: 16px; height: 16px; stroke: #fff; fill: none; stroke-width: 2; filter: drop-shadow(0 1px 2px rgba(0,0,0,.4)); }

/* forms */
.fp-field { display: block; }
.fp-field > span { display: block; font-size: 12px; font-weight: 600; letter-spacing: .5px; color: var(--ink-2); margin-bottom: 6px; }
.fp-input { width: 100%; min-height: 48px; padding: 12px 14px; border-radius: 14px; border: 1px solid var(--line); background: #fff; font-size: 16px; }
.fp-input:focus { outline: 2px solid var(--rose-l); border-color: var(--rose); }
textarea.fp-input { min-height: 140px; resize: vertical; line-height: 1.45; }
.fp-count { text-align: right; font-size: 11px; color: var(--muted); margin-top: 4px; }
.fp-check { display: flex; gap: 10px; align-items: flex-start; font-size: 13px; color: var(--ink-2); }
.fp-check input { width: 22px; height: 22px; margin: 0; accent-color: var(--rose-d); flex: 0 0 auto; }
.fp-err { color: #b3384a; font-size: 13px; }
.fp-pickers { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.fp-picker { position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px; min-height: 96px; border: 1.5px dashed #dfc3bd; border-radius: 14px; background: var(--card); font-size: 13px; color: var(--ink-2); text-align: center; }
.fp-picker svg { width: 26px; height: 26px; stroke: var(--rose-d); fill: none; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.fp-picker small { font-size: 11px; color: var(--muted); }
.fp-picker input { position: absolute; inset: 0; opacity: 0; width: 100%; height: 100%; cursor: pointer; }
.fp-thumbs { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.fp-thumb { position: relative; aspect-ratio: 1; border-radius: 12px; overflow: hidden; background: var(--rose-l); }
.fp-thumb img { width: 100%; height: 100%; object-fit: cover; }
.fp-thumb button { position: absolute; top: 6px; right: 6px; width: 28px; height: 28px; border-radius: 50%; background: rgba(33, 27, 26, .65); color: #fff; font-size: 16px; line-height: 28px; }
.fp-thumb .busy { position: absolute; inset: 0; display: grid; place-items: center; background: rgba(255, 255, 255, .6); font-size: 12px; }
.fp-results { margin-top: 8px; border: 1px solid var(--line); border-radius: 14px; overflow: hidden; background: #fff; }
.fp-results button { display: flex; align-items: center; gap: 10px; width: 100%; padding: 10px 12px; text-align: left; border-bottom: 1px solid var(--line); font-size: 14px; }
.fp-results button:last-child { border-bottom: 0; }
.fp-results img, .fp-results .ph { width: 38px; height: 38px; border-radius: 8px; object-fit: cover; background: var(--rose-l); }
.fp-chips { display: flex; flex-wrap: wrap; gap: 8px; }

/* ---------- chat ---------- */
.fp-chat { display: flex; flex-direction: column; min-height: calc(100vh - 56px - var(--nav-h)); }
.fp-chat-sub { text-align: center; font-size: 12px; color: var(--muted); margin-top: -6px; padding-bottom: 6px; }
.fp-chat-sub i { display: inline-block; width: 7px; height: 7px; border-radius: 50%; background: #58b37a; margin-right: 6px; vertical-align: middle; }
.fp-pinned { margin: 0 16px; padding: 10px 12px; border-radius: 12px; background: var(--rose-l); font-size: 13px; }
.fp-pinned b { font-size: 10px; letter-spacing: 2px; text-transform: uppercase; color: var(--rose-d); display: block; }
.fp-msgs { flex: 1; padding: 10px 12px 6px; }
.fp-msg { display: flex; gap: 8px; align-items: flex-end; margin-top: 12px; }
.fp-msg .bub { max-width: 78%; padding: 8px 12px 9px; border-radius: 18px 18px 18px 6px; background: var(--card); border: 1px solid var(--line); }
.fp-msg .who { display: flex; gap: 8px; align-items: baseline; font-size: 12px; font-weight: 700; }
.fp-msg .who time { font-weight: 400; color: var(--muted); font-size: 11px; }
.fp-msg p { font-size: 14.5px; white-space: pre-wrap; word-wrap: break-word; margin-top: 1px; }
.fp-msg .img { margin-top: 6px; border-radius: 12px; overflow: hidden; max-width: 240px; }
.fp-msg.mine { flex-direction: row-reverse; }
.fp-msg.mine .bub { background: linear-gradient(145deg, #e9c4c8, #ddaab1); border-color: transparent; border-radius: 18px 18px 6px 18px; }
.fp-msg.mine .who { justify-content: flex-end; }
.fp-msg.grouped { margin-top: 3px; }
.fp-msg.grouped .fp-av { visibility: hidden; }
.fp-msg.grouped .who { display: none; }
.fp-day { text-align: center; font-size: 11px; color: var(--muted); margin: 16px 0 4px; letter-spacing: 1px; text-transform: uppercase; }
.fp-chat .fp-composer { margin: 0; position: sticky; }
.fp-attach { flex: 0 0 auto; position: relative; width: 42px; height: 42px; display: grid; place-items: center; border-radius: 50%; color: var(--ink-2); }
.fp-attach svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.fp-attach input { position: absolute; inset: 0; opacity: 0; width: 100%; cursor: pointer; }

/* ---------- levels / badges ---------- */
.fp-tier { display: flex; align-items: center; gap: 14px; padding: 18px; border-radius: var(--r); }
.fp-tier.BRONS { background: var(--bronze-bg); color: var(--bronze-ink); }
.fp-tier.SILVER { background: var(--silver-bg); color: var(--silver-ink); }
.fp-tier.GULD { background: var(--gold-bg); color: var(--gold-ink); }
.fp-tier.is-current { box-shadow: 0 0 0 2px var(--ink) inset; }
.fp-tier h3 { color: inherit; font-family: var(--sans); font-size: 15px; font-weight: 700; letter-spacing: 2px; }
.fp-tier p { font-size: 13px; opacity: .85; }
.fp-crown { width: 44px; height: 44px; border-radius: 50%; display: grid; place-items: center; background: rgba(255, 255, 255, .45); }
.fp-crown svg { width: 24px; height: 24px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linejoin: round; }
.fp-badge-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px 8px; }
.fp-badge-cell { text-align: center; font-size: 11px; color: var(--ink-2); }
.fp-badge-cell .ico { width: 56px; height: 56px; margin: 0 auto 6px; border-radius: 50%; display: grid; place-items: center; font-size: 24px; background: linear-gradient(145deg, #fbeeea, #ead0cb); }
.fp-badge-cell.off { opacity: .38; filter: grayscale(.8); }

/* ---------- rewards ---------- */
.fp-reward-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.fp-reward { display: flex; flex-direction: column; justify-content: space-between; gap: 12px; min-height: 160px; padding: 16px; border-radius: var(--r); background: var(--card); border: 1px solid var(--line); }
.fp-reward.is-open { background: linear-gradient(160deg, #fbeeea, #f0d4cf); border-color: transparent; }
.fp-reward-value { font-family: var(--serif); font-size: 38px; line-height: 1; }
.fp-reward-value small { font-size: 16px; margin-left: 4px; }
.fp-reward-meta { font-size: 12px; color: var(--ink-2); margin-top: 6px; }
.fp-locked { font-size: 11px; color: var(--muted); letter-spacing: .5px; }
.fp-voucher { padding: 16px; border-radius: var(--r); background: #fff; border: 1px solid var(--line); }
.fp-voucher-top { display: flex; justify-content: space-between; align-items: center; gap: 10px; }
.fp-voucher-value { font-family: var(--serif); font-size: 34px; line-height: 1; }
.fp-code { display: block; margin: 12px 0 8px; padding: 10px; border: 1px dashed var(--rose); border-radius: 10px; text-align: center; font-family: ui-monospace, Menlo, monospace; font-size: 16px; letter-spacing: 2px; background: #fffaf9; }
.fp-voucher-actions { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 10px; }
.fp-status { display: inline-block; padding: 3px 9px; border-radius: 999px; font-size: 10px; font-weight: 700; letter-spacing: 1px; text-transform: uppercase; background: var(--rose-l); color: var(--rose-d); }
.fp-status.REDEEMED, .fp-status.EXPIRED, .fp-status.CANCELLED { background: #eee; color: #888; }

/* rows (history, notifications, members) */
.fp-list { background: var(--card); border: 1px solid var(--line); border-radius: var(--r); overflow: hidden; }
.fp-row { display: flex; align-items: center; gap: 12px; padding: 13px 14px; border-bottom: 1px solid var(--line); width: 100%; text-align: left; }
.fp-row:last-child { border-bottom: 0; }
.fp-row-main { flex: 1; min-width: 0; }
.fp-row-title { font-size: 14px; font-weight: 500; }
.fp-row-sub { font-size: 12px; color: var(--muted); margin-top: 2px; }
.fp-row-pts { font-family: var(--serif); font-size: 20px; white-space: nowrap; text-align: right; }
.fp-row-pts.plus { color: #3f8a5d; }
.fp-row-pts.minus { color: #b3384a; }
.fp-row-pts small { display: block; font-family: var(--sans); font-size: 10px; color: var(--muted); }
.fp-row svg.chev { width: 18px; height: 18px; fill: none; stroke: var(--muted); stroke-width: 1.8; }
.fp-row.unread { background: #fff3f1; }

/* join / guest */
.fp-hero { text-align: center; padding: 34px 18px 26px; }
.fp-hero h1 { font-size: 34px; line-height: 1.1; margin-top: 10px; }
.fp-hero p { margin-top: 12px; color: var(--ink-2); }
.fp-hero .fp-btn { margin-top: 18px; }
.fp-rules { font-size: 13px; color: var(--ink-2); padding-left: 18px; margin: 8px 0 0; }
.fp-rules li { margin: 4px 0; }

/* ---------- sheet (dialogs, menus) ---------- */
.fp-sheet { position: fixed; inset: 0; z-index: 2147483000; display: flex; align-items: flex-end; justify-content: center; background: rgba(33, 27, 26, 0); transition: background .25s; }
.fp-sheet.is-on { background: rgba(33, 27, 26, .42); }
.fp-sheet-box { width: 100%; max-width: 560px; max-height: 92vh; overflow-y: auto; padding: 10px 18px calc(22px + env(safe-area-inset-bottom)); background: var(--bg); border-radius: 24px 24px 0 0; transform: translateY(100%); transition: transform .3s var(--ease); color: var(--ink); font-family: var(--sans); }
.fp-sheet.is-on .fp-sheet-box { transform: none; }
.fp-sheet-grab { width: 40px; height: 5px; border-radius: 3px; background: #dcc6c0; margin: 0 auto 14px; }
.fp-sheet h3 { font-size: 24px; margin-bottom: 6px; }
.fp-sheet .fp-menu button, .fp-sheet .fp-menu a { display: flex; align-items: center; gap: 14px; width: 100%; min-height: 50px; padding: 0 6px; font-size: 16px; border-bottom: 1px solid var(--line); text-align: left; color: var(--ink); text-decoration: none; }
.fp-sheet .fp-menu .sub { padding-left: 44px; font-size: 15px; color: var(--ink-2); min-height: 44px; }
.fp-sheet .fp-menu .is-on { color: var(--rose-d); font-weight: 600; }
.fp-sheet .fp-menu svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
/* Menu: logo + name, sections with a tinted heading bar, plain icon rows. */
.fp-sheet .fp-mz-head { display: flex; gap: 16px; align-items: center; padding: 6px 44px 18px 8px; border-bottom: 1px solid var(--line); }
.fp-sheet .fp-mz-head img { flex: none; width: 64px; height: 64px; border-radius: 50%; object-fit: cover; background: #171515; }
.fp-sheet .fp-mz-head b { display: block; font-family: var(--serif); font-size: 26px; font-weight: 500; color: var(--ink); line-height: 1.1; }
.fp-sheet .fp-mz-head small { display: block; margin-top: 4px; font-size: 11px; letter-spacing: 4px; text-transform: uppercase; color: var(--ink-2); }
.fp-sheet .fp-mz-sec { padding-bottom: 6px; border-bottom: 1px solid var(--line); }
.fp-sheet .fp-mz-sec h4 { display: flex; align-items: center; gap: 14px; margin: 10px 0 2px; padding: 9px 14px; border-radius: 8px; background: var(--rose-l); font-family: var(--sans); font-size: 13px; font-weight: 600; letter-spacing: 2.2px; text-transform: uppercase; color: var(--rose-d); }
.fp-sheet .fp-mz-sec h4 svg { width: 22px; height: 22px; fill: var(--rose-d); stroke: var(--rose-d); stroke-width: 1.4; stroke-linejoin: round; }
.fp-sheet .fp-mz-row { display: flex; align-items: center; gap: 20px; width: 100%; min-height: 50px; padding: 0 12px; text-align: left; color: var(--ink); text-decoration: none; font-size: 16.5px; }
.fp-sheet .fp-mz-row + .fp-mz-row > span:last-child { border-top: 1px solid var(--line); }
.fp-sheet .fp-mz-row > span:first-child { flex: none; display: grid; place-items: center; }
.fp-sheet .fp-mz-row > span:last-child { flex: 1; align-self: stretch; display: flex; align-items: center; justify-content: flex-start; text-align: left; }
.fp-sheet .fp-mz-row svg { flex: none; width: 24px; height: 24px; fill: none; stroke: var(--ink); stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
.fp-sheet .fp-mz-row.is-on { color: var(--rose-d); font-weight: 600; }
.fp-sheet .danger { color: #b3384a !important; }
.fp-stepper { display: flex; align-items: center; justify-content: space-between; margin-top: 16px; }
.fp-stepper-ctrl { display: flex; align-items: center; gap: 14px; }
.fp-stepper-ctrl button { width: 44px; height: 44px; border-radius: 50%; border: 1px solid var(--line); background: #fff; font-size: 22px; }
.fp-stepper-ctrl button[disabled] { opacity: .35; }
.fp-stepper-val { font-family: var(--serif); font-size: 30px; min-width: 110px; text-align: center; }
.fp-terms { margin-top: 16px; border-top: 1px solid var(--line); }
.fp-terms div { display: flex; justify-content: space-between; padding: 10px 0; border-bottom: 1px solid var(--line); font-size: 14px; }
.fp-terms span { color: var(--muted); }
.fp-sheet-actions { display: grid; gap: 10px; margin-top: 18px; }

/* lightbox */
.fp-lightbox { position: fixed; inset: 0; z-index: 2147483001; background: rgba(20, 16, 15, .94); display: flex; align-items: center; overflow-x: auto; scroll-snap-type: x mandatory; }
.fp-lightbox img { flex: 0 0 100%; max-height: 100vh; object-fit: contain; scroll-snap-align: center; }
.fp-lightbox button { position: fixed; top: calc(12px + env(safe-area-inset-top)); right: 12px; width: 44px; height: 44px; border-radius: 50%; background: rgba(255, 255, 255, .15); color: #fff; font-size: 24px; border: 0; }

/* toast */
.fp-toast { position: fixed; z-index: 2147483002; left: 50%; bottom: calc(var(--nav-h) + 24px + env(safe-area-inset-bottom)); transform: translate(-50%, 20px); opacity: 0; max-width: calc(100% - 32px); padding: 12px 18px; border-radius: 14px; background: var(--dark); color: #fff; font-family: var(--sans); font-size: 14px; text-align: center; pointer-events: none; transition: opacity .25s, transform .25s var(--ease); }
.fp-toast.is-on { opacity: 1; transform: translate(-50%, 0); }
.fp-toast b { color: #f2c7cd; }

@media (min-width: 700px) {
  .fp { padding-top: 10px; }
  .fp-page { padding: 18px 20px 0; }
  .fp-strip button { flex-basis: 24%; }
}
@media (prefers-reduced-motion: reduce) {
  .fp *, .fp-sheet * { animation: none !important; transition: none !important; }
}

/* helpers used by the app */
.fp-ico { display: inline-grid; place-items: center; line-height: 0; }
.fp-ico svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.fp-plain { display: inline-flex; align-items: center; gap: 6px; text-align: left; min-width: 0; }
.fp-stack { display: grid; gap: 14px; }
.fp-tag { display: inline; font: inherit; }
.fp-page-chat { padding: 0; }
.fp-page-chat > * + * { margin-top: 0; }
.fp-chat .fp-composer { bottom: calc(var(--nav-h) + env(safe-area-inset-bottom)); }
.fp-chat .fp-replying { margin: 0; }
.fp-msg .bub { font: inherit; color: inherit; }
.fp-msg .img img { width: 100%; height: auto; }
.fp-grid3 > span svg, .fp-grid3 .multi { position: absolute; top: 6px; right: 6px; width: 16px; height: 16px; }
.fp-chips::-webkit-scrollbar { display: none; }
.fp-chips .fp-chip { flex: 0 0 auto; }
.fp-composer .fp-av { margin-bottom: 5px; }
.fp-tile { cursor: pointer; }
.fp-voucher .fp-voucher-top + .fp-code { margin-top: 12px; }
.fp-hello .fp-av.xl { border: 3px solid #fff; }
.fp-page .fp-sheet-actions { margin-top: 0; }

.fp-post-who .fp-plain { display: flex; }
.fp-post-who .fp-level { display: inline-flex; }
.fp [hidden], .fp-sheet [hidden] { display: none !important; }

/* edit profile: the whole picture + the round version */
.fp-av-edit { display: grid; gap: 12px; }
.fp-av-full { display: grid; place-items: center; min-height: 160px; max-height: 380px; border-radius: 16px; overflow: hidden; background: var(--rose-l); }
.fp-av-full img { max-width: 100%; max-height: 380px; width: auto; height: auto; object-fit: contain; }
.fp-av-round { display: flex; align-items: center; gap: 12px; }

/* roles, verified, ratings, messages */
.fp-chip.sm { height: 26px; padding: 0 10px; font-size: 12px; }
.fp-chip.pro { background: #fbe7ea; border-color: #efc3ca; color: var(--rose-d); }
.fp-verified { color: #3f8a5d; font-weight: 700; }
.fp-pro-mark { font-size: 12px; }
.fp-prof-actions { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; margin-top: 14px; }
.fp-prof-actions .fp-btn { flex: 1; }
.fp-prof-actions .fp-icon-btn { flex: 0 0 auto; border: 1px solid var(--line); border-radius: 50%; }
.fp-stars { color: #c9a24a; font-weight: 600; font-size: 13px; letter-spacing: .5px; white-space: nowrap; }
.fp-stars small { color: var(--muted); font-weight: 400; }
.fp-stars .off { color: #e6d8d2; }
.fp-star-pick { display: flex; gap: 6px; }
.fp-star-pick button { font-size: 32px; line-height: 1; color: #e6d8d2; }
.fp-star-pick button.is-on { color: #c9a24a; }
.fp-field-label { display: block; font-size: 12px; font-weight: 600; letter-spacing: .5px; color: var(--ink-2); margin-bottom: 6px; }
.fp-role-pick { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.fp-role-pick button { display: flex; flex-direction: column; gap: 4px; align-items: flex-start; text-align: left; padding: 12px; border-radius: 14px; border: 1.5px solid var(--line); background: #fff; }
.fp-role-pick button.is-on { border-color: var(--rose-d); background: var(--rose-l); }
.fp-role-pick b { font-size: 14px; }
.fp-role-pick small { font-size: 12px; color: var(--muted); }
.fp-ellipsis { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 60vw; }
.fp-dot-inline { display: inline-block; min-width: 20px; height: 20px; padding: 0 6px; margin-top: 4px; border-radius: 10px; background: var(--rose-d); color: #fff; font-size: 11px; line-height: 20px; text-align: center; font-weight: 700; }
.fp-dm-head { position: sticky; top: 56px; z-index: 5; display: flex; align-items: center; gap: 10px; padding: 8px 16px; background: rgba(248, 239, 235, .95); border-bottom: 1px solid var(--line); }
.fp-dm-head .fp-plain { gap: 10px; }
.fp-seen { text-align: right; font-size: 11px; color: var(--muted); margin: 2px 6px 0; }
.fp-nav .fp-dot { right: calc(50% - 22px); }

/* ---------- booking invitations in private messages ---------- */
.fp-bk { margin: 14px auto 0; max-width: 340px; padding: 14px 16px; border-radius: 18px; background: var(--card); border: 1px solid var(--line); box-shadow: 0 6px 18px rgba(120,60,70,.07); display: grid; gap: 4px; }
.fp-bk.mine { border-color: #e3b9bf; }
.fp-bk-top { display: flex; align-items: center; gap: 8px; }
.fp-bk-ico svg { width: 18px; height: 18px; fill: none; stroke: var(--rose); stroke-width: 1.7; stroke-linecap: round; display: block; }
.fp-bk-status { margin-left: auto; font-size: 11.5px; font-weight: 700; padding: 3px 9px; border-radius: 99px; background: #f6ece4; color: #8a6b4f; }
.fp-bk-status.ok { background: #e3f1e6; color: #2f6b3d; }
.fp-bk-status.no { background: #f1e6e6; color: #8b4a4a; }
.fp-bk-what { font-size: 16px; margin-top: 4px; }
.fp-bk-when { font-size: 14px; color: var(--ink-2); }
.fp-bk-note { font-size: 14px; white-space: pre-wrap; margin-top: 4px; }
.fp-bk-hint { font-size: 12.5px; margin-top: 4px; }
.fp-bk-review { margin-top: 10px; display: grid; gap: 8px; font-size: 13px; font-weight: 600; color: #2f6b3d; }
.fp-bk-actions { display: flex; gap: 8px; align-items: center; margin-top: 10px; flex-wrap: wrap; }
.fp-bk-actions .fp-link { margin-left: auto; }
.fp-sys { text-align: center; font-size: 12px; color: var(--muted); margin-top: 10px; }
.fp-bk-price { font-size: 14px; font-weight: 700; color: var(--ink); }
.fp-rv-service { display: flex; gap: 6px; align-items: baseline; margin-top: 4px; font-size: 13.5px; }
.fp-rv-service small { font-size: 11px; letter-spacing: .5px; text-transform: uppercase; color: var(--muted); }
.fp-h3 { font-size: 13px; letter-spacing: .6px; text-transform: uppercase; color: var(--muted); margin: 6px 2px 8px; font-weight: 700; }
.fp-bk-row .fp-bk-status { flex: 0 0 auto; align-self: center; }

/* ---------- chat: likes + comments stay under the message ---------- */
.fp-cacts { display: flex; gap: 4px; margin: 3px 0 0 42px; }
.fp-cmsg.mine .fp-cacts { justify-content: flex-end; margin: 3px 0 0 0; }
.fp-cact { display: inline-flex; align-items: center; gap: 4px; min-height: 30px; padding: 4px 8px; border-radius: 99px; font-size: 12.5px; font-weight: 600; color: var(--muted); }
.fp-cact svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.fp-cact.is-on { color: var(--rose); }
.fp-cact.is-on svg { fill: currentColor; }
.fp-cact:last-child.is-on svg { fill: none; }
.fp-thread { margin: 4px 0 6px 42px; padding: 10px 12px; border-radius: 16px; background: var(--card); border: 1px solid var(--line); display: grid; gap: 10px; }
.fp-cmsg.mine .fp-thread { margin-left: 18%; }
.fp-thread-list { display: grid; gap: 10px; }
.fp-reply { display: flex; gap: 8px; align-items: flex-start; }
.fp-reply .fp-av { width: 26px; height: 26px; font-size: 11px; flex: 0 0 auto; }
.fp-reply-main { min-width: 0; flex: 1; }
.fp-reply-bub { display: block; text-align: left; font-size: 14px; line-height: 1.4; white-space: pre-wrap; word-wrap: break-word; }
.fp-reply-bub b { font-weight: 700; }
.fp-reply-meta { display: flex; align-items: center; gap: 6px; font-size: 11px; color: var(--muted); }
.fp-reply-meta .fp-cact { min-height: 24px; padding: 2px 6px; font-size: 11.5px; }
.fp-reply-meta .fp-cact svg { width: 14px; height: 14px; }
.fp-thread-composer { display: flex; gap: 8px; align-items: flex-end; }
.fp-thread-composer textarea { flex: 1; min-height: 38px; padding: 8px 12px; border-radius: 19px; border: 1px solid var(--line); background: #fff; font-size: 16px; resize: none; }
.fp-send.sm { width: 38px; height: 38px; }
.fp-send.sm svg { width: 18px; height: 18px; }

/* ---------- Invite Challenge ---------- */
.fp-ch-hero { border-radius: var(--r); overflow: hidden; background: var(--card); border: 1px solid var(--line); box-shadow: 0 10px 30px rgba(120,60,70,.08); }
.fp-ch-img { background: linear-gradient(160deg, #f8e9e6, #f3dcd8); display: grid; place-items: center; padding: 18px 18px 6px; }
.fp-ch-img img { width: 100%; max-width: 360px; aspect-ratio: 1 / 1; object-fit: contain; display: block; filter: drop-shadow(0 14px 24px rgba(120,60,70,.18)); }
.fp-ch-body { padding: 16px 18px 18px; display: grid; gap: 10px; }
.fp-ch-title { font-size: 28px; line-height: 1.12; }
.fp-ch-prize { display: grid; gap: 2px; padding: 12px 14px; border-radius: 14px; background: #fbf3ef; border: 1px solid #f0dcd6; }
.fp-ch-prize span { font-size: 12px; font-weight: 700; letter-spacing: .6px; text-transform: uppercase; color: var(--rose); }
.fp-ch-prize b { font-size: 18px; }
.fp-ch-prize small { font-size: 13.5px; color: var(--ink-2); font-weight: 600; }
.fp-ch-desc { font-size: 14.5px; color: var(--ink-2); white-space: pre-wrap; }
.fp-countdown { flex: 0 0 auto; font-size: 12.5px; font-weight: 700; padding: 5px 10px; border-radius: 99px; background: #2b2220; color: #fff; }
.fp-countdown.off { background: #e9e1de; color: var(--ink-2); }
.fp-three { display: grid; gap: 8px; margin-top: 12px; }
.fp-three > div { display: grid; gap: 2px; padding: 12px 14px; border-radius: 14px; background: var(--card); border: 1px solid var(--line); }
.fp-three small { font-size: 11.5px; font-weight: 700; letter-spacing: .5px; text-transform: uppercase; color: var(--muted); }
.fp-three b { font-size: 15px; }
.fp-three .hl { border-color: #e3b9bf; background: #fdf4f4; }
.fp-three .hl b { font-size: 18px; color: var(--rose); }
.fp-invite-cta { display: grid; gap: 8px; justify-items: center; margin: 14px 0 4px; }
.fp-invite-btn { min-height: 58px; font-size: 15px; letter-spacing: 1.4px; }
.fp-stats4 { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: 10px; }
.fp-stat { display: grid; gap: 2px; padding: 12px; border-radius: 14px; background: #fbf6f4; text-align: center; }
.fp-stat b { font-family: var(--serif, Georgia, serif); font-size: 30px; line-height: 1.05; }
.fp-stat small { font-size: 12px; color: var(--muted); }
.fp-next { margin-top: 12px; font-size: 14px; font-weight: 600; color: var(--ink); padding: 10px 12px; border-radius: 12px; background: #fdf4f4; }
.fp-board { display: grid; gap: 2px; margin-top: 10px; }
.fp-board-row { display: flex; align-items: center; gap: 10px; padding: 8px 6px; border-radius: 12px; }
.fp-board-row.top .fp-row-title { font-weight: 700; }
.fp-board-row.me { background: #fdf4f4; outline: 1px solid #e3b9bf; }
.fp-board-rank { width: 30px; text-align: center; font-size: 18px; font-weight: 700; color: var(--ink-2); flex: 0 0 auto; }
.fp-board-me { margin-top: 12px; padding: 12px 14px; border-radius: 14px; background: #2b2220; color: #fff; display: grid; grid-template-columns: auto 1fr; column-gap: 12px; align-items: center; }
.fp-board-me small { grid-column: 1 / -1; font-size: 11.5px; letter-spacing: .6px; text-transform: uppercase; opacity: .7; }
.fp-board-me b { font-size: 28px; }
.fp-rules-box summary { cursor: pointer; font-weight: 700; list-style: none; }
.fp-rules-box summary::after { content: ' ›'; }
.fp-rules-box[open] summary::after { content: ' ⌄'; }
.fp-winner { text-align: center; background: linear-gradient(160deg, #fff7ef, #fdeee9); border-color: #f0d9c7; }
.fp-winner-big { font-size: 46px; }
.fp-winner h3 { font-size: 26px; margin-top: 4px; }
.fp-winner .fp-ch-prize { margin-top: 10px; text-align: left; }
.fp-invite-link { display: flex; gap: 8px; align-items: center; margin-top: 8px; padding: 8px 8px 8px 12px; border-radius: 14px; background: #fbf6f4; border: 1px solid var(--line); }
.fp-invite-link span { flex: 1; min-width: 0; font-size: 13px; overflow-wrap: anywhere; }
.fp-share-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin-top: 14px; }
.fp-share-grid > * { display: grid; justify-items: center; gap: 4px; padding: 12px 6px; border-radius: 14px; background: var(--card); border: 1px solid var(--line); font-size: 22px; text-decoration: none; color: inherit; }
.fp-share-grid span { font-size: 12px; font-weight: 600; }
.fp-ref-status { flex: 0 0 auto; font-size: 12px; font-weight: 700; padding: 4px 9px; border-radius: 99px; background: #f6ece4; color: #8a6b4f; }
.fp-ref-status.qualified { background: #e3f1e6; color: #2f6b3d; }
.fp-ref-status.invalid { background: #f1e6e6; color: #8b4a4a; }
.fp-ref-status.review { background: #eef0f6; color: #4a5680; }
.fp-invite-card { display: flex; gap: 12px; align-items: center; width: 100%; text-align: left; padding: 12px; margin-bottom: 12px; border-radius: var(--r); background: linear-gradient(150deg, #fff, #fbeeeb); border: 1px solid #efd5d1; box-shadow: 0 8px 22px rgba(120,60,70,.08); }
.fp-invite-card img { width: 96px; height: 96px; object-fit: contain; flex: 0 0 auto; border-radius: 14px; background: #f8e9e6; }
.fp-invite-card.big { flex-direction: column; align-items: stretch; }
.fp-invite-card.big img { width: 100%; height: auto; aspect-ratio: 4 / 3; }
.fp-invite-card-body { display: grid; gap: 3px; min-width: 0; justify-items: start; }
.fp-invite-card-body b { font-size: 16px; line-height: 1.25; }
.fp-invite-card-body small { font-size: 13px; color: var(--ink-2); font-weight: 600; }
.fp-invite-card-meta { display: flex; gap: 10px; flex-wrap: wrap; font-size: 12.5px; color: var(--rose); font-weight: 700; margin: 2px 0 6px; }
.fp-invited { display: flex; gap: 10px; align-items: center; padding: 12px 14px; margin-bottom: 12px; border-radius: 16px; background: #fdf4f4; border: 1px solid #efd5d1; }
.fp-invited img, .fp-invited > span { width: 40px; height: 40px; border-radius: 50%; object-fit: cover; flex: 0 0 auto; display: grid; place-items: center; font-size: 22px; background: #f3dcd8; }
.fp-invited p { font-size: 14.5px; }
.fp-invited.big { margin-top: 6px; }
.fp-invited.big img, .fp-invited.big > span { width: 52px; height: 52px; }
.fp-invite-card-actions { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 4px; }

/* Community video (max 15 s) */
.fp-gallery.fp-video { background: #000; }
.fp-gallery.fp-video video { display: block; width: 100%; max-height: 640px; aspect-ratio: auto; background: #000; object-fit: contain; }
.fp-thumb.is-video img { filter: brightness(.85); }
.fp-thumb .fp-thumb-badge { position: absolute; left: 6px; bottom: 6px; color: #fff; width: 20px; height: 20px; }
.fp-thumb .fp-thumb-badge svg { stroke: #fff; }

/* Booking block after an unpaid late-cancellation fee */
.fp-ban { border-color: var(--rose, #c98b94); background: #fff4f4; margin-bottom: 14px; display: grid; gap: 6px; }
.fp-shoplook { padding-bottom: 2px; }
.fp-shoplook .fp-product .fp-btn { flex: 0 0 auto; padding: 6px 14px; }

/* "+" in the bottom bar */
.fp-nav .fp-nav-plus { color: var(--rose-d); }
.fp-plus-ring { width: 46px; height: 46px; border-radius: 50%; display: flex; align-items: center; justify-content: center; background: linear-gradient(135deg, #dcb0b5, var(--rose-d)); box-shadow: 0 6px 16px rgba(176, 116, 128, .35); }
.fp-nav .fp-plus-ring svg { stroke: #fff; stroke-width: 2.2; width: 24px; height: 24px; }
.fp-create-opt { display: flex; gap: 14px; align-items: center; width: 100%; padding: 14px; border: 1px solid var(--line); border-radius: 16px; background: #fff; text-align: left; color: var(--ink); }
.fp-create-opt b { display: block; font-size: 16px; }
.fp-create-opt small { display: block; color: var(--muted); font-size: 13px; margin-top: 2px; }
.fp-create-ico { flex: none; width: 44px; height: 44px; border-radius: 12px; display: flex; align-items: center; justify-content: center; background: rgba(176, 116, 128, .12); color: var(--rose-d); }
.fp-create-ico svg { width: 24px; height: 24px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }

.fp-top-right { display: flex; justify-content: flex-end; align-items: center; }
.fp-top-right .fp-icon-btn { position: relative; color: var(--ink); }
.fp-top .fp-cart .fp-dot, .fp-top .fp-bell .fp-dot { position: absolute; top: 4px; right: 2px; }
.fp-standalone .fp-top { top: 0; }
.fp-install { position: relative; margin-bottom: 12px; padding-right: 36px; }
.fp-install p { margin-top: 4px; }
.fp-install-x { position: absolute; top: 8px; right: 10px; font-size: 16px; color: var(--muted); }
.fp-share-ico { display: inline-block; padding: 0 4px; border: 1px solid var(--line); border-radius: 6px; font-size: 12px; }

/* ---------- in-app shop ---------- */
.fp-shop-head { position: sticky; top: 56px; z-index: 15; background: rgba(248, 239, 235, .96); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); padding: 6px 16px 0; border-bottom: 1px solid var(--line); }
.fp .fp-shop-search { border-radius: 999px; padding-left: 40px; background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23b07480' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='6'/%3E%3Cpath d='m20 20-4.5-4.5'/%3E%3C/svg%3E") no-repeat 14px center / 18px; }
.fp-shop-tabs { display: flex; gap: 22px; overflow-x: auto; scrollbar-width: none; margin-top: 8px; }
.fp-shop-tabs::-webkit-scrollbar { display: none; }
.fp-shop-tabs button { flex: none; padding: 10px 0 9px; font-size: 15px; color: var(--muted); border-bottom: 2px solid transparent; white-space: nowrap; }
.fp-shop-tabs button.is-on { color: var(--ink); font-weight: 600; border-bottom-color: var(--rose-d); }
.fp-shop-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-top: 14px; }
.fp-shop-card { display: flex; flex-direction: column; gap: 6px; text-align: left; background: var(--card); border: 1px solid var(--line); border-radius: 16px; padding: 8px 8px 12px; color: var(--ink); }
.fp-shop-img { position: relative; aspect-ratio: 1; border-radius: 12px; overflow: hidden; background: var(--rose-l); }
.fp-shop-img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.fp-shop-sale, .fp-shop-out { position: absolute; top: 8px; left: 8px; padding: 2px 8px; border-radius: 999px; font-size: 10px; font-weight: 800; letter-spacing: 1px; background: var(--rose-d); color: #fff; }
.fp-shop-out { left: auto; right: 8px; background: rgba(33, 27, 26, .75); }
.fp-shop-title { font-size: 13.5px; font-weight: 600; line-height: 1.3; min-height: 35px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.fp-shop-price { font-size: 14px; display: flex; gap: 6px; align-items: baseline; }
.fp-shop-price s, .fp-shop-pprice s { color: var(--muted); font-size: 12px; }
.fp-shop-hero { margin: 0 -16px; aspect-ratio: 1; background: var(--rose-l); overflow: hidden; }
.fp-shop-hero img { width: 100%; height: 100%; object-fit: cover; display: block; }
.fp-shop-dots { display: flex; justify-content: center; gap: 6px; margin-top: 10px; }
.fp-shop-dots span { width: 6px; height: 6px; border-radius: 50%; background: var(--line); }
.fp-shop-dots span.is-on { background: var(--rose-d); }
.fp-shop-ptitle { font-family: var(--serif); font-size: 26px; line-height: 1.15; }
.fp-shop-pprice { font-size: 20px; margin-top: 6px; display: flex; gap: 8px; align-items: baseline; }
.fp-shop-qty { display: inline-flex; align-items: center; gap: 16px; margin: 16px 0 14px; border: 1px solid var(--line); border-radius: 999px; padding: 4px 12px; }
.fp-shop-qty button { font-size: 20px; width: 28px; color: var(--ink); }
.fp-shop-qty.sm { margin: 6px 0 0; padding: 0 8px; gap: 10px; }
.fp-shop-qty.sm button { font-size: 16px; width: 22px; }

/* Dina köp */
.fp-buy { display: flex; gap: 12px; align-items: flex-start; }
.fp-buy-line { display: flex; gap: 10px; align-items: center; cursor: pointer; }
.fp-buy-img { width: 56px; height: 56px; flex: none; border-radius: 12px; object-fit: cover; background: var(--fp-soft, #f3e9e6); }
.fp-buy .fp-buy-img { width: 76px; height: 76px; }
.fp-buy-main { min-width: 0; display: grid; gap: 2px; }
.fp-buy-status { display: inline-block; margin-top: 4px; font-size: 12px; padding: 2px 8px; border-radius: 99px; background: #e8f3ea; color: #2f6b3d; }
.fp-buy-status.off { background: #f3e6e6; color: #8a3b3b; }

.fp-chips-sm .fp-chip { height: 30px; padding: 0 12px; font-size: 12.5px; }

/* LIVE NU */
.fp-live-card { display: flex; align-items: center; gap: 12px; width: 100%; text-align: left; margin-bottom: 12px; padding: 12px; border: 0; border-radius: 18px; background: #1d1716; color: #fff; cursor: pointer; }
.fp-live-img { width: 54px; height: 54px; flex: none; border-radius: 12px; object-fit: cover; background: #3a2e2c; display: grid; place-items: center; font-size: 22px; }
.fp-live-main { flex: 1; min-width: 0; display: grid; gap: 2px; }
.fp-live-main b { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-size: 15px; }
.fp-live-main small { color: rgba(255,255,255,.7); font-size: 12px; }
.fp-live-k { display: inline-flex; align-items: center; gap: 6px; width: max-content; background: #e0245e; color: #fff; font-size: 11px; font-weight: 800; letter-spacing: .08em; padding: 3px 8px; border-radius: 6px; }
.fp-live-k::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: #fff; animation: fpPulse 1.4s infinite; }
@keyframes fpPulse { 50% { opacity: .3; } }
.fp-live-cta { flex: none; background: #c9a961; color: #000; font-weight: 800; font-size: 13px; padding: 10px 14px; border-radius: 10px; }

/* Live: watching + going live, full screen inside the web app */
.fp-live-layer { position: fixed; inset: 0; z-index: 2147483000; background: #000; }
.fp-live-layer iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; background: #000; }
html.fp-live-lock, html.fp-live-lock body { overflow: hidden !important; }
.fp-live-x { position: absolute; top: max(10px, env(safe-area-inset-top)); right: 10px; width: 40px; height: 40px; border: 0; border-radius: 50%; background: rgba(0,0,0,.45); color: #fff; font-size: 24px; line-height: 1; cursor: pointer; z-index: 2; }
.fp-bc { color: #fff; }
.fp-bc-video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.fp-bc-video.is-mirror { transform: scaleX(-1); }
.fp-bc-top { position: absolute; left: 0; right: 0; top: 0; padding: max(10px, env(safe-area-inset-top)) 10px 10px; display: flex; align-items: center; justify-content: space-between; gap: 8px; background: linear-gradient(rgba(0,0,0,.45), transparent); }
.fp-bc-status { display: flex; align-items: center; gap: 10px; font-weight: 700; font-size: 14px; text-shadow: 0 1px 3px rgba(0,0,0,.5); }
.fp-bc-icon { width: 40px; height: 40px; border: 0; border-radius: 50%; background: rgba(0,0,0,.45); color: #fff; font-size: 20px; cursor: pointer; }
.fp-bc-icon.is-off { background: #e0245e; }
.fp-bc-end { height: 40px; padding: 0 16px; border: 0; border-radius: 999px; background: #e0245e; color: #fff; font-weight: 800; cursor: pointer; }
.fp-bc-pre { position: absolute; left: 0; right: 0; bottom: 0; padding: 20px 16px max(24px, env(safe-area-inset-bottom)); display: grid; gap: 12px; background: linear-gradient(transparent, rgba(0,0,0,.6)); }
.fp-bc-title, .fp-bc-say { width: 100%; height: 48px; padding: 0 16px; border: 1px solid rgba(255,255,255,.35); border-radius: 999px; background: rgba(0,0,0,.35); color: #fff; font-size: 16px; }
.fp-bc-title::placeholder, .fp-bc-say::placeholder { color: rgba(255,255,255,.7); }
.fp-bc-go { height: 56px; border: 0; border-radius: 999px; background: #e0245e; color: #fff; font-weight: 900; font-size: 17px; letter-spacing: .08em; cursor: pointer; }
.fp-bc-go:disabled { opacity: .7; }
.fp-bc-air { position: absolute; left: 0; right: 0; bottom: 0; padding: 0 12px max(16px, env(safe-area-inset-bottom)); display: grid; gap: 10px; }
.fp-bc-chat { display: grid; gap: 6px; max-width: 80%; }
.fp-bc-msg { width: max-content; max-width: 100%; padding: 6px 10px; border-radius: 14px; background: rgba(0,0,0,.4); font-size: 14px; line-height: 1.3; }
.fp-bc-done { display: grid; gap: 4px; text-align: center; font-size: 18px; }
.fp-bc-done small { color: rgba(255,255,255,.75); font-size: 14px; }
.fp-bc [hidden] { display: none !important; }
.fp-bc-title, .fp-bc-say { box-sizing: border-box; }

.fp-level.ADMIN { background: linear-gradient(135deg, #1d1716, #3a2e2c); color: #c9a961; }

/* LIVE in the feed: muted video tile */
.fp-lt { position: relative; display: block; width: 100%; aspect-ratio: 9 / 13; max-height: 72vh; margin-bottom: 12px; padding: 0; border: 0; border-radius: 18px; overflow: hidden; background: #1d1716; color: #fff; cursor: pointer; text-align: left; }
.fp-lt-video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.fp-lt-top { position: absolute; left: 12px; right: 12px; top: 12px; display: flex; gap: 8px; align-items: center; }
.fp-lt-v { background: rgba(0,0,0,.45); border-radius: 6px; padding: 3px 8px; font-size: 12px; font-weight: 700; }
.fp-lt-bottom { position: absolute; left: 0; right: 0; bottom: 0; display: flex; gap: 10px; align-items: center; justify-content: space-between; padding: 40px 14px 14px; background: linear-gradient(transparent, rgba(0,0,0,.7)); }
.fp-lt-bottom b { font-size: 16px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.fp-lt-wait { position: absolute; inset: 0; display: grid; place-items: center; font-size: 14px; color: rgba(255,255,255,.75); }
.fp-lt[data-state="playing"] .fp-lt-wait { display: none; }
.fp-lt[data-state="waiting"] .fp-lt-wait::after { content: " (väntar på bild)"; }

/* Product page: description + dropdowns like the store */
.fp-rich { margin-top: 8px; font-size: 14.5px; line-height: 1.55; color: var(--ink-2); }
.fp-rich p { margin: 0 0 10px; }
.fp-rich h3, .fp-rich h4 { margin: 12px 0 6px; font-size: 15px; color: var(--ink); }
.fp-rich ul, .fp-rich ol { margin: 0 0 10px; padding-left: 20px; }
.fp-rich li { margin: 3px 0; }
.fp-rich strong, .fp-rich b { color: var(--ink); }
.fp-rich img { max-width: 100%; height: auto; border-radius: 10px; }
.fp-rich table { width: 100%; border-collapse: collapse; }
.fp-rich td, .fp-rich th { padding: 6px 4px; border-bottom: 1px solid var(--line); text-align: left; vertical-align: top; }
.fp-rich-clip { max-height: 210px; overflow: hidden; -webkit-mask-image: linear-gradient(#000 70%, transparent); mask-image: linear-gradient(#000 70%, transparent); }
.fp-link { border: 0; background: none; padding: 0; color: var(--rose-d); font-weight: 700; cursor: pointer; }
.fp-acc { margin-top: 12px; background: var(--card); border: 1px solid var(--line); border-radius: 18px; overflow: hidden; }
.fp-acc:empty { display: none; }
.fp-acc-item + .fp-acc-item { border-top: 1px solid var(--line); }
.fp-acc-item summary { list-style: none; display: flex; justify-content: space-between; align-items: center; padding: 16px 18px; font-weight: 700; cursor: pointer; }
.fp-acc-item summary::-webkit-details-marker { display: none; }
.fp-acc-item summary::after { content: ""; width: 8px; height: 8px; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: rotate(45deg) translateY(-3px); transition: transform .2s; }
.fp-acc-item[open] summary::after { transform: rotate(225deg) translateY(-3px); }
.fp-acc-item .fp-rich { margin: 0; padding: 0 18px 16px; }
.fp-stock { margin-top: 12px; font-size: 13px; font-weight: 600; color: #2f6b3d; }
.fp-stock:empty { display: none; }
.fp-stock.low { color: #b06a00; }
.fp-stock.out { color: #b3261e; }
.fp-buy-again { flex: none; margin-left: auto; }

/* Product gallery: swipe */
.fp-gal { position: relative; overflow: hidden; }
.fp-gal-track { display: flex; width: 100%; height: 100%; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
.fp-gal-track::-webkit-scrollbar { display: none; }
.fp-gal-slide { flex: 0 0 100%; scroll-snap-align: center; display: grid; place-items: center; }
.fp-gal-slide img { width: 100%; height: 100%; object-fit: cover; user-select: none; }
.fp-gal-nav { position: absolute; top: 50%; transform: translateY(-50%); width: 36px; height: 36px; border: 0; border-radius: 50%; background: rgba(255,255,255,.85); color: var(--ink); font-size: 22px; line-height: 1; cursor: pointer; box-shadow: 0 2px 8px rgba(0,0,0,.12); }
.fp-gal-nav.prev { left: 10px; } .fp-gal-nav.next { right: 10px; }
.fp-gal-count { position: absolute; right: 10px; bottom: 10px; background: rgba(0,0,0,.5); color: #fff; font-size: 12px; font-weight: 700; padding: 3px 8px; border-radius: 999px; }
.fp-shop-dots span { cursor: pointer; }
.fp-gal-thumbs { display: flex; gap: 8px; overflow-x: auto; margin-top: 10px; scrollbar-width: none; }
.fp-gal-thumbs::-webkit-scrollbar { display: none; }
.fp-gal-thumbs button { flex: 0 0 auto; width: 58px; height: 58px; padding: 0; border: 2px solid transparent; border-radius: 12px; overflow: hidden; background: var(--card); cursor: pointer; }
.fp-gal-thumbs button.is-on { border-color: var(--rose); }
.fp-gal-thumbs img { width: 100%; height: 100%; object-fit: cover; }

/* Beauty filters panel */
.fp-bc-video.is-source { opacity: 0; }
.fp-bc-fx { position: absolute; left: 0; right: 0; bottom: 0; z-index: 3; padding: 14px 16px max(18px, env(safe-area-inset-bottom)); background: rgba(20,14,13,.86); border-radius: 22px 22px 0 0; display: grid; gap: 10px; -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); }
.fp-bc-fx-head { display: flex; align-items: center; gap: 12px; }
.fp-bc-fx-head b { flex: 1; font-size: 16px; }
.fp-bc-fx-head .fp-link { color: #f3b7c3; }
.fp-bc-fx-row { display: grid; grid-template-columns: 110px 1fr; align-items: center; gap: 12px; font-size: 14px; }
.fp-bc-fx-row input { width: 100%; accent-color: #e0245e; }

/* Guests on stage: split screen */
.fp-bc-guests { position: absolute; top: 0; right: 0; bottom: 0; width: 50%; display: none; grid-auto-rows: 1fr; background: #000; }
.fp-bc.has-guests .fp-bc-guests { display: grid; }
.fp-bc.has-guests .fp-bc-video { width: 50%; }
.fp-bc-guest { position: relative; overflow: hidden; border-left: 2px solid #000; border-bottom: 2px solid #000; }
.fp-bc-guest video { width: 100%; height: 100%; object-fit: cover; }
.fp-bc-gname { position: absolute; left: 8px; bottom: 8px; font-size: 12px; font-weight: 700; background: rgba(0,0,0,.45); padding: 2px 8px; border-radius: 999px; }
.fp-bc-gdown { position: absolute; right: 8px; top: 64px; border: 0; border-radius: 999px; background: rgba(0,0,0,.55); color: #fff; font-size: 12px; font-weight: 700; padding: 6px 10px; cursor: pointer; }
.fp-bc-msg.can { border: 0; color: #fff; text-align: left; cursor: pointer; font: inherit; font-size: 14px; }
.fp-toast { z-index: 2147483646 !important; }

.fp-bc-icon.is-loading { animation: fpPulse 1.2s ease-in-out infinite; }
@keyframes fpPulse { 50% { opacity: .35; } }
.fp-bc-fx-note { font-size: 13px; color: #f3d3a0; }
.fp-bc-fx-note.ok { color: #9be3a8; }
.fp-bc-icon.fp-bc-fxbtn { width: auto; padding: 0 14px; border-radius: 99px; font-size: 14px; font-weight: 700; white-space: nowrap; }

/* Manual filter controls (TikTok style) */
.fp-bc-fx-slider { display: flex; align-items: center; gap: 14px; padding: 4px 2px; }
.fp-bc-fx-range { flex: 1; -webkit-appearance: none; appearance: none; height: 6px; border-radius: 99px; background: linear-gradient(90deg, #e0245e var(--p, 50%), rgba(255,255,255,.25) var(--p, 50%)); outline: none; touch-action: none; }
.fp-bc-fx-range::-webkit-slider-thumb { -webkit-appearance: none; width: 30px; height: 30px; border-radius: 50%; background: #fff; box-shadow: 0 2px 8px rgba(0,0,0,.4); }
.fp-bc-fx-range::-moz-range-thumb { width: 30px; height: 30px; border: 0; border-radius: 50%; background: #fff; }
.fp-bc-fx-num { width: 34px; text-align: right; font-size: 17px; }
.fp-bc-fx-chips { display: flex; gap: 8px; overflow-x: auto; padding-bottom: 2px; scrollbar-width: none; }
.fp-bc-fx-chips::-webkit-scrollbar { display: none; }
.fp-bc-fx-chip { flex: none; display: grid; justify-items: center; gap: 3px; min-width: 72px; padding: 10px 8px; border: 2px solid transparent; border-radius: 16px; background: rgba(255,255,255,.1); color: #fff; font-size: 12px; font-weight: 600; cursor: pointer; }
.fp-bc-fx-chip .ic { font-size: 22px; line-height: 1; }
.fp-bc-fx-chip small { font-size: 11px; opacity: .6; }
.fp-bc-fx-chip.has small { opacity: 1; color: #f3b7c3; }
.fp-bc-fx-chip.on { border-color: #e0245e; background: rgba(224,36,94,.22); }

/* Booking change proposal */
.fp-bk-change { margin-top: 10px; padding: 12px; border-radius: 14px; background: rgba(224,36,94,.07); border: 1px solid rgba(224,36,94,.25); display: grid; gap: 8px; }
.fp-bk-change-rows { display: grid; gap: 4px; font-size: 14px; }
.fp-bk-change-rows > div { display: flex; gap: 10px; justify-content: space-between; }
.fp-bk-change-rows > div > span:last-child { font-weight: 600; text-align: right; }

/* Live post in the feed: who just joined */
.fp-lt { cursor: pointer; }
.fp-lt-v:empty { display: none; }
.fp-lt-joins { position: absolute; left: 12px; bottom: 70px; display: grid; gap: 6px; justify-items: start; pointer-events: none; z-index: 1; }
.fp-lt-join { background: rgba(0,0,0,.45); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); color: #fff; font-size: 13px; padding: 5px 10px; border-radius: 99px; animation: fpJoinIn .3s ease-out; transition: opacity .6s, transform .6s; }
.fp-lt-join b { color: #f3d3a0; }
.fp-lt-join.out { opacity: 0; transform: translateY(-8px); }
@keyframes fpJoinIn { from { opacity: 0; transform: translateX(-12px); } }
.fp-bc-join { opacity: .85; font-size: 13px; }

/* Mina tider: green = free, red = booked/busy */
.fp-slot-st { display: inline-flex; align-items: center; gap: 4px; padding: 6px 12px; border-radius: 99px; font-size: 13px; font-weight: 700; white-space: nowrap; border: 1px solid transparent; font-family: inherit; }
.fp-slot-st.free { background: #e3f4e6; color: #1f7a35; border-color: #b9e2c1; }
.fp-slot-st.busy { background: #fde4e4; color: #b3261e; border-color: #f4bcbc; }
button.fp-slot-st { cursor: pointer; }

/* Önskelista, gåvor, dela profil */
.fp-prod-extra { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 10px; }
.fp-prod-extra .fp-btn { flex: 1 1 140px; }
.fp-prod-extra .fp-btn.is-on { color: #b4235a; border-color: #e9a9c0; }
.fp-gift { border: 1px solid #ecd3dc; background: linear-gradient(180deg, #fff, #fdf3f6); }
.fp-gift-head { font-size: 14px; }
.fp-gift-item { display: flex; gap: 10px; align-items: center; margin-top: 10px; cursor: pointer; }
.fp-gift-item img { width: 64px; height: 64px; object-fit: cover; border-radius: 12px; flex: none; }
.fp-gift-msg { margin: 8px 0 0; font-style: italic; }
.fp-share-link { margin: 12px 0 4px; padding: 10px 12px; border-radius: 12px; background: #f6efeb; font-size: 13px; word-break: break-all; user-select: all; }

/* Kalender (Mina tider / Boka behandling) */
.fp-cal-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px; text-transform: capitalize; }
.fp-cal-head .fp-icon-btn { font-size: 22px; width: 36px; height: 36px; }
.fp-cal-head .fp-icon-btn[disabled] { opacity: .3; }
.fp-cal-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 4px; }
.fp-cal-w { text-align: center; font-size: 11px; color: #8a7f76; text-transform: uppercase; padding-bottom: 2px; }
.fp-cal-d { position: relative; height: 46px; border: 0; border-radius: 12px; background: transparent; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px; font: inherit; cursor: pointer; color: inherit; padding: 0; }
.fp-cal-d.empty { cursor: default; }
.fp-cal-d b { font-weight: 500; font-size: 14px; }
.fp-cal-d.has b { font-weight: 700; }
.fp-cal-d.past { opacity: .4; }
.fp-cal-d.today b { color: #b4235a; }
.fp-cal-d.is-on { background: #171412; color: #fff; }
.fp-cal-d.is-on.today b { color: #fff; }
.fp-cal-dots { display: flex; gap: 3px; height: 6px; }
.fp-cal-dots i, .fp-cal-legend i { width: 6px; height: 6px; border-radius: 50%; display: inline-block; }
.fp-cal-dots i.free, .fp-cal-legend i.free { background: #2f9e57; }
.fp-cal-dots i.busy, .fp-cal-legend i.busy { background: #d6334c; }
.fp-cal-legend { display: flex; gap: 14px; margin-top: 10px; font-size: 12px; color: #6b6259; }

/* iPhone home-screen app: no rubber-band bounce – the bounce moved the bottom bar with the page. */
html, body { overscroll-behavior: none; overscroll-behavior-y: none; }

/* Produktrecensioner */
.fp-stars.lg { font-size: 18px; }
.fp-review-head { display: grid; grid-template-columns: auto 1fr; gap: 18px; align-items: center; margin-top: 12px; }
.fp-review-avg { display: grid; justify-items: center; gap: 2px; min-width: 92px; }
.fp-review-avg b { font-family: var(--serif); font-size: 40px; line-height: 1; color: var(--ink); }
.fp-review-dist { display: grid; gap: 4px; }
.fp-review-dist button { display: grid; grid-template-columns: 34px 1fr 26px; gap: 8px; align-items: center; font-size: 12px; color: var(--ink-2); padding: 2px 4px; border-radius: 8px; }
.fp-review-dist button.is-on { background: var(--rose-l); font-weight: 700; }
.fp-review-dist i { display: block; height: 7px; border-radius: 4px; background: #efe3de; overflow: hidden; }
.fp-review-dist em { display: block; height: 100%; background: #c9a24a; border-radius: 4px; }
.fp-review-imgs { display: flex; gap: 6px; overflow-x: auto; margin-top: 10px; scrollbar-width: none; }
.fp-review-imgs::-webkit-scrollbar { display: none; }
.fp-review-imgs img { width: 76px; height: 76px; flex: none; object-fit: cover; border-radius: 10px; background: var(--rose-l); }
.fp-verified-buy { color: #4f8a5b; font-weight: 600; font-size: 12px; }
.fp-review-reply { margin-top: 10px; padding: 10px 12px; border-radius: 12px; background: var(--rose-l); font-size: 14px; }
/* Kampanjer & vinster */
.fp-row-end { font-size: 13px; font-weight: 600; white-space: nowrap; }
.fp-pill { display: inline-block; padding: 3px 10px; border-radius: 999px; font-size: 12px; font-weight: 600; white-space: nowrap; }
details.fp-card summary { list-style: revert; }
.fp-cm-like { font-size: 13px; color: var(--muted); }
.fp-cm-like.is-on { color: #c2475d; font-weight: 600; }

/* Betygsätt dina köp */
.fp-rate-row{display:flex;align-items:center;gap:12px;margin-top:12px}
.fp-rate-row img,.fp-rate-ph{width:56px;height:56px;border-radius:12px;object-fit:cover;flex:none;background:var(--soft,#f7eeee);display:flex;align-items:center;justify-content:center}
.fp-rate-main{flex:1;min-width:0;display:flex;flex-direction:column}
.fp-rate-main b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
img.fp-av.fp-note-prod{object-fit:cover;border-radius:10px}

/* Gratis pincett från 800 kr */
.fp-promo{display:block;width:100%;border:0;background:#2b2326;color:#fff;font:600 13px/1.35 inherit;padding:9px 14px;text-align:center;cursor:pointer;letter-spacing:.2px}

/* Fransbloggen */
.fp-blog-list { display: grid; gap: 10px; margin-top: 12px; }
.fp-blog-card { display: grid; grid-template-columns: 96px 1fr; gap: 12px; align-items: center; width: 100%; text-align: left; background: var(--card, #fff); border: 1px solid var(--line, #eee2e2); border-radius: 16px; padding: 8px; cursor: pointer; color: inherit; font: inherit; }
.fp-blog-card img, .fp-blog-ph { width: 96px; height: 96px; border-radius: 12px; object-fit: cover; background: var(--rose-l, #f7eeee); display: grid; place-items: center; font-size: 28px; }
.fp-blog-txt { display: grid; gap: 3px; min-width: 0; }
.fp-blog-txt b { font-size: 15px; line-height: 1.3; }
.fp-blog-txt span { font-size: 13px; line-height: 1.35; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.fp-article h1 { font-size: 24px; line-height: 1.25; margin: 14px 0 6px; }
.fp-article-hero { width: 100%; border-radius: 16px; aspect-ratio: 4 / 3; object-fit: cover; display: block; }
.fp-blog-body { font-size: 16px; line-height: 1.6; overflow-wrap: anywhere; }
.fp-blog-body h2 { font-size: 19px; margin: 22px 0 6px; }
.fp-blog-body h3 { font-size: 17px; margin: 18px 0 6px; }
.fp-blog-body p { margin: 0 0 12px; }
.fp-blog-body ul, .fp-blog-body ol { padding-left: 22px; margin: 0 0 12px; }
.fp-blog-body img { max-width: 100%; height: auto; border-radius: 12px; display: block; margin: 12px 0; }
.fp-blog-body a { color: var(--rose-d, #8f4f5c); font-weight: 600; }
.fp-blog-body table { width: 100%; border-collapse: collapse; font-size: 14px; display: block; overflow-x: auto; }
.fp-blog-body td, .fp-blog-body th { border: 1px solid var(--line, #eee2e2); padding: 6px 8px; }
/* Följare / följer (only visible to the member herself) */
.fp-link-btn{background:none;border:0;padding:0;font:inherit;color:inherit;cursor:pointer;text-decoration:underline;text-underline-offset:3px;text-decoration-color:#d9c7c0}
.fp-follow-list{display:grid;gap:2px}
.fp-follow-row{display:flex;align-items:center;gap:12px;width:100%;text-align:left;background:none;border:0;border-bottom:1px solid #f1e6e2;padding:10px 2px;font:inherit;color:inherit;cursor:pointer}
.fp-follow-name{display:grid;flex:1;min-width:0}
.fp-follow-row small.fp-muted{white-space:nowrap}

/* Computer: the web app uses the whole screen (phone layout unchanged). */
.fp-pd-media > * + *, .fp-pd-info > * + * { margin-top: 14px; }
@media (min-width: 700px) and (max-width: 1023px) {
  .fp { max-width: 960px; }
  .fp-shop-grid { grid-template-columns: repeat(3, 1fr); }
}
@media (min-width: 1024px) {
  .fp { max-width: 1360px; }
  .fp-page { padding: 24px 32px 0; }
  .fp-shop-head { padding: 8px 32px 0; }
  .fp-shop-grid { grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 18px; }
  /* Feed on a computer: one wide post at a time, picture on the left, name + text + likes beside it. */
  .fp-stack { grid-template-columns: 1fr; max-width: 1040px; margin: 0 auto; gap: 22px; }
  .fp-post:has(> .fp-gallery) { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); grid-template-rows: repeat(6, min-content) 1fr; column-gap: 0; }
  .fp-post:has(> .fp-gallery) > * { grid-column: 2; }
  .fp-post:has(> .fp-gallery) > .fp-gallery { grid-column: 1; grid-row: 1 / 8; align-self: stretch; margin: 0; }
  .fp-post:has(> .fp-gallery) > .fp-post-body { padding-top: 4px; }
  .fp-post:has(> .fp-gallery) > .fp-gallery > * { width: 100%; }
  .fp-post:has(> .fp-gallery) > .fp-gallery img { width: 100%; height: 100%; object-fit: cover; }
  .fp-grid3 { grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); margin: 0; gap: 6px; }
  .fp-nav-in { max-width: 720px; }
  .fp-fab { right: max(24px, calc(50% - 660px)); }
  .fp-pd { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); gap: 40px; align-items: start; }
  .fp-pd-media { position: sticky; top: 72px; }
  .fp-pd-info > .fp-card:first-child { margin-top: 0 !important; }
}

/* Product mentions in post text (.Lashboost) */
.fp-ptag{color:var(--rose-d);font-weight:700;text-decoration:underline;text-underline-offset:2px;cursor:pointer}

/* Utförsäljning label (card + product page) */
.fp-shop-sale{font-size:10px;letter-spacing:.06em}
.fp-shop-sale-tag{display:inline-block;margin-left:10px;padding:3px 9px;border-radius:999px;background:var(--rose-d);color:#fff;font-size:12px;font-weight:600;vertical-align:middle}

/* Post carousel: several pictures, one at a time */
.fp-carousel { display: block; position: relative; background: var(--rose-l); }
.fp-car-track { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
.fp-car-track::-webkit-scrollbar { display: none; }
.fp-car-slide { flex: 0 0 100%; scroll-snap-align: center; aspect-ratio: 4 / 5; max-height: 640px; }
.fp-car-slide img { width: 100%; height: 100%; object-fit: cover; display: block; }
.fp-car-count { position: absolute; top: 10px; right: 10px; padding: 2px 9px; border-radius: 999px; background: rgba(0,0,0,.55); color: #fff; font-size: 12px; font-weight: 600; }
.fp-car-dots { position: absolute; left: 0; right: 0; bottom: 10px; display: flex; justify-content: center; gap: 5px; pointer-events: none; }
.fp-car-dots span { width: 6px; height: 6px; border-radius: 50%; background: rgba(255,255,255,.55); }
.fp-car-dots span.is-on { background: #fff; }
.fp-car-btn { position: absolute; top: 50%; transform: translateY(-50%); width: 34px; height: 34px; border-radius: 50%; border: 0; background: rgba(255,255,255,.85); color: #1a1714; font-size: 22px; line-height: 1; display: none; cursor: pointer; }
.fp-car-btn.prev { left: 10px; } .fp-car-btn.next { right: 10px; }
@media (hover: hover) { .fp-carousel:hover .fp-car-btn { display: block; } }
@media (min-width: 1024px) { .fp-carousel { height: 100%; } .fp-carousel .fp-car-track { height: 100%; } .fp-carousel .fp-car-slide { max-height: none; aspect-ratio: auto; height: 100%; min-height: 420px; } }

.fp-loop-sep{text-align:center;color:var(--muted);font-size:13px;padding:18px 0 6px}

/* Återpublicera & dela */
.fp-act.repost.is-on { color: #2f9e6e; }
.fp-act.repost.is-on svg { fill: none; stroke: #2f9e6e; }
.fp-repost-by { display: flex; align-items: center; gap: 6px; padding: 10px 14px 0; font-size: 13px; color: var(--ink-2); }
.fp-repost-by svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.fp-share-people { display: flex; gap: 12px; overflow-x: auto; padding: 12px 2px 10px; scrollbar-width: none; }
.fp-share-people::-webkit-scrollbar { display: none; }
.fp-share-person { position: relative; flex: 0 0 64px; display: flex; flex-direction: column; align-items: center; gap: 5px; font-size: 12px; }
.fp-share-person .nm { max-width: 64px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.fp-share-person .ck { position: absolute; top: 30px; right: 6px; width: 20px; height: 20px; border-radius: 50%; font-size: 12px; line-height: 20px; color: #fff; }
.fp-share-person.is-on .ck { background: var(--rose-d); box-shadow: 0 0 0 2px #fff; }
.fp-share-person.is-on .nm { font-weight: 600; }
.fp-shared { max-width: 240px; }
.fp-shared-card { display: flex; flex-direction: column; gap: 6px; width: 100%; margin-top: 6px; padding: 0 0 8px; text-align: left; background: #fff; border: 1px solid var(--line); border-radius: 14px; overflow: hidden; color: var(--ink); }
.fp-shared-card img { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; }
.fp-shared-card .who { display: flex; align-items: center; gap: 6px; padding: 0 10px; font-size: 13px; }
.fp-shared-card .txt { padding: 0 10px; font-size: 13px; color: var(--ink-2); }

/* Profilen (TikTok-lik) */
.fp-prof2 { margin-top: 14px; }
.fp-prof-top { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; }
.fp-prof-id { min-width: 0; }
.fp-prof2 h2 { margin-top: 4px; font-size: 26px; line-height: 1.15; word-break: break-word; }
.fp-pstats { display: flex; gap: 28px; margin-top: 14px; }
.fp-pstat { display: flex; flex-direction: column; align-items: flex-start; gap: 1px; padding: 0; background: none; text-align: left; }
.fp-pstat b { font-size: 19px; font-weight: 700; line-height: 1.2; color: var(--ink); }
.fp-pstat span { font-size: 13px; color: var(--muted); }
.fp-prof-chips { display: flex; gap: 6px; flex-wrap: wrap; align-items: center; margin-top: 12px; }
.fp-prof-more { display: flex; gap: 6px; overflow-x: auto; margin: 14px -16px 0; padding: 0 16px 2px; scrollbar-width: none; }
.fp-prof-more::-webkit-scrollbar { display: none; }
.fp-prof-more .fp-chip { flex: 0 0 auto; }
.fp-ptabs { display: flex; margin: 14px -16px 0; border-bottom: 1px solid var(--line); }
.fp-ptab { flex: 1; display: flex; justify-content: center; padding: 11px 0 10px; color: var(--muted); border-bottom: 2px solid transparent; }
.fp-ptab.is-on { color: var(--ink); border-color: var(--ink); }
.fp-ptab svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linejoin: round; stroke-linecap: round; }

/* Skicka till (dela) */
.fp-sendto h3 { margin: 0; text-align: center; font-size: 18px; font-weight: 600; }
.fp-send-head { display: grid; grid-template-columns: 44px 1fr 44px; align-items: center; margin: 0 0 8px; }
.fp-sendto hr { border: 0; border-top: 1px solid var(--line); margin: 10px -18px; }
.fp-sendto .fp-input { margin: 4px 0 6px; }
.fp-send-head .fp-icon-btn svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; }
.fp-send-row { display: flex; gap: 14px; overflow-x: auto; padding: 6px 2px 4px; scrollbar-width: none; }
.fp-send-row::-webkit-scrollbar { display: none; }
.fp-app { position: relative; flex: 0 0 64px; display: flex; flex-direction: column; align-items: center; gap: 6px; background: none; border: 0; padding: 0; color: var(--ink); }
.fp-app .ic { width: 56px; height: 56px; border-radius: 50%; display: grid; place-items: center; background: #efe8e6; font-size: 22px; }
.fp-app .ic svg { width: 28px; height: 28px; }
.fp-app.act .ic svg { width: 24px; height: 24px; fill: none; stroke: var(--ink); stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.fp-app.act.danger .ic { color: #c0392b; }
.fp-app .lb { font-size: 12px; line-height: 1.25; text-align: center; max-width: 66px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.fp-friend .fp-av { width: 56px; height: 56px; font-size: 22px; }
.fp-friend .ck { position: absolute; top: 38px; right: 2px; width: 20px; height: 20px; border-radius: 50%; display: none; place-items: center; font-size: 12px; color: #fff; background: var(--rose-d); box-shadow: 0 0 0 2px #fff; }
.fp-friend.is-on .ck { display: grid; }
.fp-friend.is-on .fp-av { box-shadow: 0 0 0 2px var(--rose-d); }
.fp-send-box { display: grid; gap: 6px; margin-top: 6px; }
.fp-qr { width: min(260px, 70vw); margin: 10px auto; }
.fp-qr svg { width: 100%; height: auto; display: block; border-radius: 12px; }
.fp-top-extra { display: contents; }
.fp-top-extra svg { width: 23px; height: 23px; }
.fp-social a .ic { width: 22px; height: 22px; border-radius: 6px; display: grid; place-items: center; }
.fp-social a .ic svg { width: 15px; height: 15px; }
.fp-social a .ic.ig { background: linear-gradient(45deg,#feda75,#fa7e1e 25%,#d62976 50%,#962fbf 75%,#4f5bd5); }
.fp-social a .ic.tt { background: #111; }
.fp-social a { color: var(--ink); text-decoration: none; font-weight: 500; }
.fp-follow-av { position: relative; flex: 0 0 auto; display: inline-flex; }
.fp-noback-dot { position: absolute; right: 0; bottom: 1px; width: 13px; height: 13px; border-radius: 50%; background: #e0393e; box-shadow: 0 0 0 2px var(--bg); }
.fp-follow-name b.fp-back-name { color: #1f9d55; }
.fp-prof-city { margin-top: 3px; font-size: 14px; color: var(--ink-2); }
.fp-menu .fp-menu-head { padding: 14px 4px 4px; font-size: 11px; font-weight: 600; letter-spacing: 1px; text-transform: uppercase; color: var(--muted); }

/* Mina bokningar */
.fp-bhead { display: flex; justify-content: flex-end; gap: 8px; margin-top: 4px; }
.fp-blist { display: grid; gap: 12px; margin-top: 14px; }
.fp-bcard { background: var(--card); border: 1px solid var(--line); border-radius: 18px; padding: 14px; }
.fp-bcard-top { display: flex; align-items: center; gap: 10px; }
.fp-bcard-who { display: flex; flex-direction: column; min-width: 0; }
.fp-bcard-who b { font-size: 15px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.fp-bcard-who small { font-size: 12px; color: var(--muted); }
.fp-bcard-main { margin-top: 10px; padding-top: 10px; border-top: 1px solid var(--line); display: grid; gap: 4px; }
.fp-bcard-service { font-family: var(--serif); font-size: 18px; color: var(--ink); }
.fp-bcard-line { display: flex; align-items: center; gap: 6px; font-size: 14px; color: var(--ink); }
.fp-bcard-line.muted { color: var(--muted); font-size: 13px; }
.fp-bcard-line svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.7; }
.fp-bcard-actions { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 12px; }
.fp-bd-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding-right: 36px; }
.fp-bd-who { display: flex; align-items: center; gap: 10px; margin-top: 12px; text-align: left; }
.fp-bd-who span { display: flex; flex-direction: column; } .fp-bd-who small { color: var(--muted); font-size: 12px; }
.fp-bd-list { margin-top: 12px; border-top: 1px solid var(--line); }
.fp-bd-row { display: flex; justify-content: space-between; gap: 12px; padding: 9px 0; border-bottom: 1px solid var(--line); font-size: 14px; }
.fp-bd-row span { color: var(--muted); } .fp-bd-row b { font-weight: 600; text-align: right; }
.fp-bd-hist { margin-top: 14px; display: grid; gap: 6px; }
.fp-bd-hist > div { display: flex; justify-content: space-between; gap: 10px; font-size: 13px; padding: 6px 0; border-bottom: 1px solid var(--line); }
.fp-bd-hist small { color: var(--muted); white-space: nowrap; }
.fp-btn.fp-danger { color: #b3261e; }
@media (min-width: 720px) { .fp-blist { grid-template-columns: 1fr 1fr; } }

/* Menu: eight headings, each opens its list right below (one at a time). */
.fp-sheet .fp-acc-menu .fp-acc-label { flex: 1; }
.fp-sheet .fp-acc-menu .fp-acc-arrow svg { width: 18px; height: 18px; color: var(--muted); transition: transform .2s var(--ease); }
.fp-sheet .fp-acc-menu .fp-acc.is-open .fp-acc-arrow svg { transform: rotate(90deg); }
.fp-sheet .fp-acc-menu .fp-acc.is-open > .fp-acc-head { font-weight: 600; }
.fp-acc-list { display: none; }
.fp-acc.is-open > .fp-acc-list { display: block; }
.fp-sheet .fp-acc-menu .fp-acc-list .sub { padding-left: 42px; }
.fp-sheet .fp-menu-guest { margin-bottom: 6px; }
.fp-menu-out { display: grid; gap: 10px; margin-top: 18px; }
.fp-btn.fp-red { background: #b3261e; border-color: #b3261e; color: #fff; text-align: center; justify-content: center; text-decoration: none; }
.fp-btn.fp-red-ghost { background: transparent; border: 1px solid #b3261e; color: #b3261e !important; }
.fp-sheet .fp-acc-menu .fp-menu-review { min-height: 40px; font-size: 13px; color: var(--muted); border-bottom: 0; justify-content: center; }
/* Automatic booking: treatments, day strip, start times, working hours */
.fp-ok-line { color: #1f7a35; font-size: 13px; font-weight: 600; }
.fp-svc-row { display: flex; gap: 8px; align-items: center; padding: 10px 0; border-top: 1px solid var(--line); }
.fp-svc-row:first-child { border-top: 0; padding-top: 0; }
.fp-day-strip { display: flex; gap: 8px; overflow-x: auto; padding: 4px 2px 8px; margin-top: 12px; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
.fp-day-strip::-webkit-scrollbar { display: none; }
.fp-day { flex: 0 0 64px; display: flex; flex-direction: column; align-items: center; gap: 2px; padding: 8px 4px; border-radius: 14px; border: 1px solid var(--line); background: var(--card); font: inherit; color: inherit; cursor: pointer; }
.fp-day b { font-size: 18px; }
.fp-day small { font-size: 11px; color: var(--ink-2); }
.fp-day small:first-child { text-transform: capitalize; }
.fp-day.none { opacity: .45; }
.fp-day.is-on { background: var(--rose-l); border-color: var(--rose); }
.fp-day.is-on b { color: var(--rose-d); }
.fp-time-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(78px, 1fr)); gap: 8px; margin-top: 10px; }
.fp-time { height: 44px; border-radius: 12px; border: 1px solid #b9e2c1; background: #e3f4e6; color: #1f7a35; font: inherit; font-weight: 700; font-size: 15px; cursor: pointer; }
.fp-time:active { transform: scale(.97); }
.fp-hours-d { display: grid; grid-template-columns: 1fr; gap: 6px; padding: 10px 0; border-top: 1px solid var(--line); }
.fp-hours-d:first-child { border-top: 0; }
.fp-hours-p { display: flex; gap: 6px; align-items: center; }
.fp-hours-p .fp-input { min-width: 0; width: 0; flex: 1 1 0; padding-left: 10px; padding-right: 10px; }
.fp-hours-p .fp-icon-btn { flex: 0 0 auto; }
.fp-svc-row { flex-wrap: wrap; }
.fp-svc-row > div:first-child { flex: 1 1 55%; }
/* Text pages: the brand in the top bar is not a heading (one <h1> per page for Google). */
.fp-top .fp-top-t { margin: 0; text-align: center; font-weight: 500; color: var(--ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* Webshop: the bar title is a div (the page has its own H1 for Google) – same look as the h1. */
.fp-top div.fp-top-title { font-family: var(--serif); font-weight: 500; margin: 0; color: var(--ink); letter-spacing: .2px; text-align: center; font-size: 22px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.fp-top div.fp-top-title.fp-brand { letter-spacing: 3px; font-size: 16px; text-transform: uppercase; }
.fp-top div.fp-top-title.has-sub { display: flex; flex-direction: column; align-items: center; line-height: 1.1; min-width: 0; letter-spacing: 2px; font-size: 15px; }

/* Wide single pictures (före/efter side by side): show the whole picture, no crop. */
.fp-gallery.n1.wide button { aspect-ratio: auto; max-height: none; }
.fp-gallery.n1.wide img, .fp-post:has(> .fp-gallery) > .fp-gallery.wide img { height: auto; object-fit: contain; }

/* AI label on pictures made or changed with AI (set by the app/server, cannot be removed by the poster). */
.fp-car-slide { position: relative; }
.fp-ai-tag { position: absolute; left: 8px; bottom: 8px; z-index: 2; padding: 4px 10px; border-radius: 999px; background: rgba(20, 20, 20, .72); color: #fff; font-size: 12px; font-weight: 600; line-height: 1.3; pointer-events: none; }
.fp-car-slide .fp-ai-tag { bottom: 30px; }
/* Wide pictures in a carousel are shown whole (före/efter). */
.fp-car-slide.wide img { object-fit: contain; }

/* ---- Inlägg som Instagram + proffsigare typografi, samma färger (Lela 2026-10-13) ---- */
.fp { --sans: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif; --serif: "Cormorant Garamond", "Playfair Display", Georgia, "Times New Roman", serif; font-feature-settings: "cv11", "ss01", "ss03"; letter-spacing: -.005em; }
.fp h1, .fp h2, .fp h3, .fp-sheet h2 { font-family: var(--serif); font-weight: 600; letter-spacing: .005em; }
.fp-brand { font-weight: 600; white-space: nowrap; }
@media (max-width: 420px) { .fp .fp-top-title.fp-brand { letter-spacing: 1.2px !important; } }
.fp-eyebrow, .fp-pin, .fp-pinned b { font-weight: 600; letter-spacing: 2.5px; }
/* Kortet: kant till kant, tunn linje mellan inläggen. */
.fp-post { border-radius: 0; border-left: 0; border-right: 0; border-top: 0; border-bottom: 1px solid var(--line); margin: 0 !important; }
.fp-stack { gap: 0 !important; }
.fp-stack > .fp-card { margin-left: 12px; margin-right: 12px; }
.fp-post-head { padding: 12px 14px 10px; gap: 10px; }
.fp-post-head > .fp-plain .fp-av, .fp-post-head > .fp-av { width: 34px; height: 34px; font-size: 15px; box-shadow: 0 0 0 2px var(--card), 0 0 0 3.5px var(--rose); margin: 2px; }
.fp-post-who b { font-size: 14px; font-weight: 600; letter-spacing: -.01em; }
.fp-post-time { font-size: 12.5px; }
.fp-post-time::before { content: "· "; }
.fp-post-head .fp-icon-btn svg { width: 22px; height: 22px; }
/* Bilden: alltid fylld (4:5 stående, 4:3 liggande) – inga svarta kanter. */
.fp-gallery.n1 button { aspect-ratio: 4 / 5; max-height: none; background: var(--rose-l); }
.fp-gallery.n1.wide button { aspect-ratio: 4 / 3; }
.fp-gallery.n1 img, .fp-gallery.n1.wide img, .fp-post:has(> .fp-gallery) > .fp-gallery.wide img { width: 100%; height: 100%; object-fit: cover; }
.fp-car-slide, .fp-car-slide.wide { aspect-ratio: 4 / 5; background: var(--rose-l); }
.fp-car-slide img { width: 100%; height: 100%; object-fit: cover; }
/* Ikonrad direkt under bilden, räknarna står på egen rad. */
.fp-actions { padding: 6px 8px 0; gap: 10px; }
.fp-act { min-height: 44px; padding: 0 4px; gap: 6px; border-radius: 0; }
.fp-act svg { width: 26px; height: 26px; stroke-width: 1.6; }
.fp-act:active svg { transform: scale(.85); }
.fp-actions .fp-act > span:not(.fp-ico) { font-size: 15px; font-weight: 500; margin-left: 2px; }
.fp-post-meta { padding: 0 14px 14px; font-size: 14px; line-height: 1.45; }
.fp-post-likes { font-weight: 600; }
.fp-post-caption { margin-top: 2px; white-space: pre-wrap; overflow-wrap: anywhere; }
.fp-post-caption .fp-plain { display: inline; } .fp-post-caption b { font-weight: 600; margin-right: 5px; }
.fp-post-more { color: var(--muted); margin-top: 3px; display: block; }
.fp-post-date { margin-top: 4px; font-size: 12.5px; color: var(--muted); }
.fp-post > .fp-challenge-tag { margin: 0 14px 10px; }
.fp-post > .fp-shoplook { padding: 10px 14px 0; }
@media (min-width: 700px) {
  .fp-post:has(> .fp-gallery) { display: block; }
  .fp-stack { max-width: 520px; }
  .fp-post { border: 1px solid var(--line); border-radius: 4px; margin: 0 0 20px !important; }
}

/* Flödet som ett enda långt inlägg: kant till kant, inga boxar, inga linjer (Lela 2026-10-13). */
.fp-stack { margin-left: -16px; margin-right: -16px; background: var(--bg); }
.fp-stack > .fp-post { background: var(--bg); }
.fp-post-head > .fp-plain .fp-av, .fp-post-head > .fp-av { box-shadow: 0 0 0 2px var(--bg), 0 0 0 3.5px var(--rose); }
.fp-stack > .fp-post { border: 0 !important; border-radius: 0 !important; padding-bottom: 6px; }
.fp-stack > .fp-post + .fp-post { padding-top: 4px; }
.fp-stack > .fp-card { margin: 10px 14px; }
.fp-stack > .fp-pinned { margin: 10px 14px; }
.fp-post-meta { padding-bottom: 10px; }
@media (min-width: 700px) {
  .fp-stack { margin-left: 0; margin-right: 0; background: transparent; }
  .fp-stack > .fp-post { border: 1px solid var(--line) !important; border-radius: 4px !important; margin-bottom: 20px !important; }
}

/* ---- Polish: webshop, kort, knappar (Lela 2026-10-13) ---- */
.fp-promo { background: var(--rose-d) !important; color: #fff; font-weight: 500; letter-spacing: .01em; font-size: 13.5px; }
.fp-shop-intro h1 { font-family: var(--serif); font-size: 23px !important; font-weight: 600; letter-spacing: .01em; }
.fp-shop-intro p { font-size: 13.5px !important; }
.fp-shop-grid { gap: 14px 12px; }
.fp-shop-card { background: var(--card); border: 1px solid var(--line); border-radius: 14px; padding: 0 0 12px; overflow: hidden; text-align: left; box-shadow: 0 1px 2px rgba(60,30,30,.04); transition: transform .18s var(--ease), box-shadow .18s var(--ease); }
.fp-shop-card:active { transform: scale(.985); }
.fp-shop-img { aspect-ratio: 4 / 5; background: #fff; border-radius: 0; margin: 0; overflow: hidden; }
.fp-shop-img img { width: 100%; height: 100%; object-fit: cover; }
.fp-shop-title { padding: 10px 12px 0; font-size: 13.5px; font-weight: 500; line-height: 1.3; letter-spacing: -.005em; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.fp-shop-price { padding: 4px 12px 0; font-size: 14px; font-weight: 600; color: var(--rose-d); }
.fp-chip { font-weight: 500; letter-spacing: .01em; }
.fp-chip.is-on { background: var(--rose-d); color: #fff; border-color: var(--rose-d); }
.fp-btn { font-weight: 600; letter-spacing: .08em; }
.fp-card { box-shadow: 0 1px 2px rgba(60,30,30,.04); }
.fp-page input.fp-input, .fp-page input[type=search] { border-radius: 14px; }

/* Profilbild utan foto: mjuk rosa gradient med initialen i serif. */
.fp-av { background: linear-gradient(145deg, #f3dfe0 0%, #d9a9b0 55%, #b97a86 100%); color: #fff; font-family: var(--serif); font-weight: 600; text-shadow: 0 1px 1px rgba(0,0,0,.08); }

/* ---- Stories (24 h) som på Instagram (Lela 2026-10-13) ---- */
.fp-stories { display: flex; gap: 12px; overflow-x: auto; padding: 10px 14px 4px; margin: 0 -16px 6px; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
.fp-stories::-webkit-scrollbar { display: none; }
.fp-story { display: flex; flex-direction: column; align-items: center; gap: 5px; flex: none; width: 70px; }
.fp-story-ring { position: relative; display: block; width: 64px; height: 64px; border-radius: 50%; padding: 3px; background: linear-gradient(45deg, #8f4f5c, #e6a9b5 55%, #c98f98); }
.fp-story.seen .fp-story-ring { background: var(--line); }
.fp-story.add .fp-story-ring { background: var(--line); }
.fp-story-ring .fp-av { width: 100%; height: 100%; border: 2px solid var(--bg); font-size: 20px; }
.fp-story-plus { position: absolute; right: -1px; bottom: -1px; width: 22px; height: 22px; border-radius: 50%; background: var(--rose-d); color: #fff; border: 2px solid var(--bg); font-size: 16px; line-height: 18px; text-align: center; font-weight: 600; }
.fp-story-name { font-size: 11px; color: var(--ink-2); max-width: 70px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.fp-story-prev { margin-top: 10px; border-radius: 14px; overflow: hidden; background: #000; aspect-ratio: 9 / 14; max-height: 52vh; }
.fp-story-prev img { width: 100%; height: 100%; object-fit: contain; display: block; }
html.fp-story-open { overflow: hidden; }
.fp-story-view { position: fixed; inset: 0; z-index: 220; background: #000; display: flex; flex-direction: column; color: #fff; user-select: none; -webkit-user-select: none; touch-action: none; outline: 0; }
.fp-story-bars { display: flex; gap: 4px; padding: calc(10px + env(safe-area-inset-top)) 10px 0; }
.fp-story-bars span { flex: 1; height: 3px; border-radius: 2px; background: rgba(255,255,255,.35); overflow: hidden; }
.fp-story-bars span i { display: block; height: 100%; width: 0; background: #fff; }
.fp-story-bars span.done i { width: 100%; }
.fp-story-bars span.on i { animation: fp-story-fill 5s linear forwards; }
.fp-story-view.paused .fp-story-bars span.on i { animation-play-state: paused; }
@keyframes fp-story-fill { from { width: 0; } to { width: 100%; } }
.fp-story-head { display: flex; align-items: center; gap: 10px; padding: 10px 12px; }
.fp-story-head .fp-av { width: 34px; height: 34px; }
.fp-story-head b { font-size: 14px; color: #fff; }
.fp-story-head small { color: rgba(255,255,255,.7); font-size: 12px; }
.fp-story-head .fp-plain { color: #fff; }
.fp-story-head > button[aria-label="Stäng"] { margin-left: auto; color: #fff; font-size: 30px; line-height: 1; padding: 0 6px; }
.fp-story-img { flex: 1; min-height: 0; display: flex; align-items: center; justify-content: center; position: relative; }
.fp-story-img img { max-width: 100%; max-height: 100%; object-fit: contain; pointer-events: none; }
.fp-story-tap { position: absolute; top: 0; bottom: 0; width: 35%; left: 0; }
.fp-story-tap.r { left: auto; right: 0; width: 65%; }
.fp-story-cap { padding: 10px 16px; font-size: 14.5px; text-shadow: 0 1px 3px rgba(0,0,0,.6); white-space: pre-wrap; }
.fp-story-foot { display: flex; gap: 14px; padding: 8px 16px calc(14px + env(safe-area-inset-bottom)); font-size: 13px; }
.fp-story-foot button { color: #fff; display: inline-flex; gap: 6px; align-items: center; padding: 8px 12px; border-radius: 999px; background: rgba(255,255,255,.14); }
@media (min-width: 700px) { .fp-story-view { max-width: 460px; margin: 0 auto; border-radius: 0; } .fp-story-view::before { content: ""; position: fixed; inset: 0; background: rgba(0,0,0,.85); z-index: -1; } }

/* ---- Finafransar Beauty World (3D) (Lela 2026-10-13) ---- */
.fw-root { position: fixed; inset: 0; z-index: 150; background: #f7e9ec; overflow: hidden; touch-action: none; font-family: var(--sans); }
.fw-canvas { position: absolute; inset: 0; width: 100%; height: 100%; display: block; }
.fw-hud { position: absolute; inset: 0; pointer-events: none; }
.fw-hud > * { pointer-events: auto; }
.fw-top { position: absolute; top: calc(10px + env(safe-area-inset-top)); left: 10px; right: 10px; display: flex; gap: 6px; align-items: center; flex-wrap: wrap; }
.fw-chip { background: rgba(255,250,248,.92); border: 1px solid #eddcd6; border-radius: 999px; padding: 8px 12px; font: 600 13px/1 var(--sans); color: #3b2f2c; box-shadow: 0 2px 8px rgba(60,30,30,.08); cursor: pointer; }
.fw-chip.on { background: #8f4f5c; color: #fff; border-color: #8f4f5c; }
.fw-chip.fw-save { background: #8f4f5c; color: #fff; border-color: #8f4f5c; }
.fw-chip.fw-wide { width: 100%; margin-top: 10px; padding: 12px; }
.fw-level, .fw-online { font: 600 12px/1 var(--sans); color: #5a4d49; background: rgba(255,250,248,.85); padding: 7px 10px; border-radius: 999px; }
.fw-joy { position: absolute; left: 22px; bottom: calc(26px + env(safe-area-inset-bottom)); width: 120px; height: 120px; border-radius: 50%; background: rgba(255,255,255,.28); border: 1.5px solid rgba(255,255,255,.7); backdrop-filter: blur(4px); touch-action: none; }
.fw-joy-knob { position: absolute; left: 50%; top: 50%; width: 52px; height: 52px; margin: -26px 0 0 -26px; border-radius: 50%; background: rgba(143,79,92,.85); box-shadow: 0 4px 12px rgba(0,0,0,.18); }
.fw-run { position: absolute; right: 22px; bottom: calc(44px + env(safe-area-inset-bottom)); width: 64px; height: 64px; border-radius: 50%; background: rgba(255,250,248,.9); border: 1px solid #eddcd6; font: 600 12px var(--sans); color: #3b2f2c; }
.fw-run.on { background: #8f4f5c; color: #fff; }
.fw-act { position: absolute; left: 50%; bottom: calc(120px + env(safe-area-inset-bottom)); transform: translateX(-50%); background: #8f4f5c; color: #fff; border: 0; border-radius: 999px; padding: 14px 22px; font: 600 15px var(--sans); box-shadow: 0 6px 20px rgba(143,79,92,.35); animation: fw-pop .25s var(--ease); }
@keyframes fw-pop { from { transform: translateX(-50%) scale(.8); opacity: 0; } to { transform: translateX(-50%) scale(1); opacity: 1; } }
.fw-help { position: absolute; left: 50%; top: calc(64px + env(safe-area-inset-top)); transform: translateX(-50%); max-width: 90%; text-align: center; background: rgba(59,47,44,.75); color: #fff; font: 500 12.5px/1.4 var(--sans); padding: 8px 14px; border-radius: 12px; transition: opacity .6s; }
.fw-help.off { opacity: 0; pointer-events: none; }
.fw-toast { position: absolute; left: 50%; top: calc(110px + env(safe-area-inset-top)); transform: translateX(-50%) translateY(-6px); background: rgba(59,47,44,.85); color: #fff; font: 600 13.5px var(--sans); padding: 10px 16px; border-radius: 999px; opacity: 0; transition: opacity .2s, transform .2s; pointer-events: none; white-space: nowrap; max-width: 92%; overflow: hidden; text-overflow: ellipsis; }
.fw-toast.on { opacity: 1; transform: translateX(-50%) translateY(0); }
.fw-editbar { position: absolute; left: 10px; right: 10px; bottom: calc(16px + env(safe-area-inset-bottom)); display: flex; gap: 6px; flex-wrap: wrap; justify-content: center; }
.fw-sheet { position: absolute; inset: 0; background: rgba(0,0,0,.35); display: flex; align-items: flex-end; justify-content: center; }
.fw-sheet-box { background: #fffaf8; border-radius: 20px 20px 0 0; padding: 18px 16px calc(18px + env(safe-area-inset-bottom)); width: 100%; max-width: 560px; max-height: 80%; overflow: auto; color: #3b2f2c; }
.fw-sheet-box > b { display: block; font: 600 18px var(--serif); margin-bottom: 10px; }
.fw-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.fw-item { display: flex; flex-direction: column; align-items: center; gap: 4px; background: #fff; border: 1px solid #eddcd6; border-radius: 14px; padding: 12px 6px; font: 500 12px var(--sans); color: #3b2f2c; }
.fw-item small { color: #8f4f5c; font-weight: 600; }
.fw-item.locked { opacity: .6; } .fw-item.locked small { color: #b8913a; }
.fw-item-ico { font-size: 26px; }
.fw-row { margin: 10px 0; } .fw-row small { display: block; color: #7a6f6a; margin-bottom: 6px; font-weight: 600; letter-spacing: .04em; text-transform: uppercase; font-size: 11px; }
.fw-swatches { display: flex; gap: 8px; flex-wrap: wrap; }
.fw-swatch { width: 34px; height: 34px; border-radius: 50%; border: 2px solid #fff; box-shadow: 0 0 0 1px #d9c9c3; }
.fw-swatch.on { box-shadow: 0 0 0 3px #8f4f5c; }
.fw-chips { display: flex; gap: 6px; flex-wrap: wrap; }

/* ---- Finafransar notice as the first card in the feed (Lela 2026-10-13) ---- */
.fp .fp-ffnotice { background: #fff7f3; border-top: 1px solid #f0dcd6; border-bottom: 1px solid #f0dcd6; padding: 14px 16px 16px; margin-bottom: 8px; }
.fp .fp-av-ff { display: inline-flex; align-items: center; justify-content: center; background: linear-gradient(135deg, #f7b5c8, #8f4f5c); color: #fff; font-size: 18px; }
.fp .fp-ffnotice-text { font-size: 15.5px; line-height: 1.5; margin-top: 10px; white-space: normal; word-break: break-word; }
.fp .fp-ffnotice .fp-post-who small { display: block; font-size: 12px; }

/* ---- Webshop redesign (Lela 2026-10-14): only .fp-shop-* – nothing else in the app is touched ---- */
.fp .fp-shop-head2 { padding: 8px 16px 10px; border-bottom: 0; background: var(--bg); }
.fp .fp-shop-search { height: 46px; border: 1px solid #e9dcd8; box-shadow: 0 1px 2px rgba(60, 30, 30, .04); font-size: 15px; }
.fp .fp-shop-hero2 { position: relative; margin: 6px 0 16px; min-height: 196px; border-radius: 22px; overflow: hidden; padding: 22px 20px 20px; color: #fff; background: #a96a76 url("https://butik.finafransar.com/cdn/shop/articles/Wispy_fransar_33.jpg?width=900") 78% 40% / cover no-repeat; }
.fp .fp-shop-hero2::before { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(143, 79, 92, .97) 0%, rgba(143, 79, 92, .9) 42%, rgba(143, 79, 92, .15) 100%); }
.fp .fp-shop-hero2-txt { position: relative; max-width: 68%; }
.fp .fp-shop-eyebrow { display: inline-block; font-size: 11px; letter-spacing: .14em; text-transform: uppercase; background: rgba(255, 255, 255, .18); border: 1px solid rgba(255, 255, 255, .35); border-radius: 999px; padding: 4px 10px; }
.fp .fp-shop-hero2 h1 { font-family: var(--serif); font-size: 30px; line-height: 1.08; margin: 10px 0 8px; font-weight: 500; color: #fff; }
.fp .fp-shop-hero2 p { font-size: 14px; line-height: 1.4; opacity: .95; margin: 0 0 14px; }
.fp .fp-shop-hero2 .fp-btn.fp-shop-cta { background: #fff; color: #7a4350; border-radius: 999px; padding: 11px 18px; font-weight: 600; letter-spacing: .06em; font-size: 13px; }
.fp .fp-shop-hero2-badge { position: absolute; right: 14px; bottom: 14px; width: 86px; height: 86px; border-radius: 50%; background: #fff; color: #3b2f2c; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 1px; font-size: 10px; text-align: center; box-shadow: 0 6px 18px rgba(60, 30, 30, .18); }
.fp .fp-shop-hero2-badge .fp-ico { width: 20px; height: 20px; color: #8f4f5c; }
.fp .fp-shop-hero2-badge b { font-size: 11px; letter-spacing: .04em; text-transform: uppercase; }
.fp .fp-shop-cats { display: flex; gap: 14px; overflow-x: auto; scrollbar-width: none; padding: 2px 0 6px; margin: 0 -16px; padding-left: 16px; padding-right: 16px; }
.fp .fp-shop-cats::-webkit-scrollbar { display: none; }
.fp .fp-shop-cat { flex: none; width: 74px; display: flex; flex-direction: column; align-items: center; gap: 7px; font-size: 12.5px; font-weight: 500; color: var(--ink); }
.fp .fp-shop-cat-img { width: 66px; height: 66px; border-radius: 50%; overflow: hidden; background: #f3dde1; border: 1px solid #ecd6d9; display: block; }
.fp .fp-shop-cat-img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.fp .fp-shop-trust { display: flex; justify-content: space-between; gap: 6px; margin: 8px 0 18px; padding: 10px 12px; background: #fbf4f2; border: 1px solid #efe0dc; border-radius: 18px; }
.fp .fp-shop-trust > div { display: flex; align-items: center; gap: 6px; min-width: 0; flex: 1; }
.fp .fp-shop-trust > div + div { border-left: 1px solid #efe0dc; padding-left: 10px; }
.fp .fp-shop-trust .fp-ico { width: 20px; height: 20px; color: #8f4f5c; flex: none; }
.fp .fp-shop-trust b { display: block; font-size: 11.5px; line-height: 1.15; white-space: nowrap; }
.fp .fp-shop-trust span { font-size: 11px; color: var(--muted); }
.fp .fp-shop-sec { margin-top: 10px; }
.fp .fp-shop-sec-h { display: flex; align-items: baseline; justify-content: space-between; margin: 0 0 2px; }
.fp .fp-shop-sec-h h2 { font-family: var(--serif); font-size: 24px; font-weight: 500; margin: 0; }
.fp .fp-shop-sec-h .fp-link { color: #8f4f5c; font-size: 14px; }
.fp .fp-shop-grid { gap: 12px; margin: 12px 0 18px; }
.fp .fp-shop-card { position: relative; gap: 6px; padding: 8px 10px 12px; background: #fff; border: 1px solid #eee2de; border-radius: 18px; box-shadow: 0 1px 2px rgba(60, 30, 30, .03); cursor: pointer; }
.fp .fp-shop-img { aspect-ratio: 1; border-radius: 14px; background: #f7f0ed; }
.fp .fp-shop-off { position: absolute; top: 8px; left: 8px; padding: 4px 9px; border-radius: 999px; font-size: 12px; font-weight: 600; letter-spacing: .02em; background: #8f4f5c; color: #fff; }
.fp .fp-shop-out { position: absolute; top: 8px; right: 44px; left: auto; padding: 3px 8px; border-radius: 999px; font-size: 10px; font-weight: 700; letter-spacing: .06em; background: rgba(59, 47, 44, .78); color: #fff; }
.fp .fp-shop-wish { position: absolute; top: 6px; right: 6px; width: 34px; height: 34px; border-radius: 50%; background: rgba(255, 255, 255, .92); color: #3b2f2c; display: flex; align-items: center; justify-content: center; box-shadow: 0 1px 4px rgba(60, 30, 30, .12); }
.fp .fp-shop-wish .fp-ico { width: 18px; height: 18px; }
.fp .fp-shop-wish.is-on { color: #8f4f5c; }
.fp .fp-shop-wish.is-on .fp-ico svg path { fill: currentColor; }
.fp .fp-shop-title { font-size: 14px; font-weight: 500; min-height: 36px; margin-top: 4px; }
.fp .fp-shop-stars { display: flex; align-items: center; gap: 5px; font-size: 12px; color: var(--muted); min-height: 16px; }
.fp .fp-shop-stars .fp-stars { color: #8f4f5c; font-size: 12px; letter-spacing: 1px; }
.fp .fp-shop-stars .fp-stars .off { color: #e6d3d6; }
.fp .fp-shop-foot { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-top: 2px; }
.fp .fp-shop-price { flex-wrap: wrap; gap: 6px; }
.fp .fp-shop-price b { font-size: 16px; font-weight: 600; }
.fp .fp-shop-buy { flex: none; width: 36px; height: 36px; border-radius: 11px; background: #8f4f5c; color: #fff; display: flex; align-items: center; justify-content: center; }
.fp .fp-shop-buy .fp-ico { width: 18px; height: 18px; }
.fp .fp-shop-buy:disabled { background: #d9c9c6; }
.fp .fp-shop-foot2 { margin: 28px 0 8px; padding-top: 14px; border-top: 1px solid #eddcd6; font-size: 13px; color: #7a6f6a; display: grid; gap: 8px; }
.fp .fp-shop-foot2 nav { display: flex; flex-wrap: wrap; gap: 12px; }
.fp .fp-shop-foot2 a { color: inherit; text-decoration: underline; }
@media (min-width: 720px) { .fp .fp-shop-grid { grid-template-columns: repeat(4, 1fr); } .fp .fp-shop-hero2 { min-height: 260px; padding: 34px 32px; } .fp .fp-shop-hero2 h1 { font-size: 40px; } .fp .fp-shop-cat { width: 96px; } .fp .fp-shop-cat-img { width: 84px; height: 84px; } }

/* ---- Webshop: svart, guld och elfenben (Lela 2026-10-14). Endast webshoppens vyer (.fp-top-lux, .fp-shop-*) ---- */
.fp .fp-top.fp-top-lux { background: #12100e; border-bottom: 1px solid #b8964f; color: #d9b96f; }
.fp .fp-top.fp-top-lux .fp-icon-btn { color: #d9b96f; }
.fp .fp-top.fp-top-lux .fp-dot { background: #c9a35a; color: #12100e; }
.fp .fp-top.fp-top-lux .fp-top-title.fp-brand { color: #e2c27e; font-family: var(--serif); font-weight: 600; font-size: 22px; letter-spacing: .14em !important; line-height: 1; text-align: center; }
.fp .fp-top.fp-top-lux .fp-top-sub { display: block; margin-top: 5px; color: #cdb27a; font-family: var(--sans); font-size: 8.5px; font-weight: 500; letter-spacing: .34em; text-transform: uppercase; }
.fp .fp-promo { background: #12100e !important; color: #e8d3a4; border-bottom: 1px solid rgba(201, 163, 90, .35); font-family: var(--serif); font-size: 14.5px; letter-spacing: .02em; }
.fp .fp-shop-head2 { background: #faf6ef; }
.fp .fp-shop-search { border-color: #e6d9c2; background-color: #fff; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23b08a3e' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='6'/%3E%3Cpath d='m20 20-4.5-4.5'/%3E%3C/svg%3E"); }
.fp .fp-shop-hero2 { min-height: 214px; color: #1a1612; border: 1px solid #ebdfc9; background: radial-gradient(120% 90% at 85% 20%, #fffaf1 0%, rgba(255, 250, 241, 0) 55%), radial-gradient(90% 120% at 0% 100%, #e9dcc6 0%, rgba(233, 220, 198, 0) 60%), linear-gradient(135deg, #f6eee1 0%, #efe3cf 55%, #e6d6bd 100%); }
.fp .fp-shop-hero2::before { content: none; }
.fp .fp-shop-hero2-img { position: absolute; right: -8px; bottom: 0; width: 56%; height: 100%; object-fit: contain; object-position: right bottom; mix-blend-mode: multiply; pointer-events: none; }
.fp .fp-shop-hero2-txt { max-width: 58%; z-index: 1; }
.fp .fp-shop-eyebrow { color: #3b3127; background: transparent; border: 1px solid #c4a466; letter-spacing: .22em; font-size: 10.5px; padding: 5px 12px; }
.fp .fp-shop-hero2 h1 { color: #15110d; font-weight: 500; font-size: 31px; }
.fp .fp-shop-hero2 p { color: #3b3127; opacity: 1; font-size: 13.5px; }
.fp .fp-shop-hero2 .fp-btn.fp-shop-cta { background: #15110d; color: #e6c785; border: 1px solid #15110d; letter-spacing: .14em; font-size: 12.5px; padding: 12px 20px; }
.fp .fp-shop-hero2-badge { z-index: 1; background: #fffdf8; border: 1px solid #e6d6b4; color: #15110d; }
.fp .fp-shop-hero2-badge .fp-ico { color: #b08a3e; }
.fp .fp-shop-cat-img { border: 1.5px solid #d7bd85; background: #f7f0e4; }
.fp .fp-shop-trust { background: #fffdf8; border-color: #ebdfc9; }
.fp .fp-shop-trust > div + div { border-left-color: #ebdfc9; }
.fp .fp-shop-trust .fp-ico { color: #b08a3e; }
.fp .fp-shop-sec-h .fp-link { color: #9a7634; }
.fp .fp-shop-off { background: #15110d; color: #e6c785; }
.fp .fp-shop-buy { background: #15110d; color: #e6c785; }
.fp .fp-shop-wish.is-on { color: #b08a3e; }
.fp .fp-shop-stars .fp-stars { color: #b08a3e; }
.fp .fp-shop-stars .fp-stars .off { color: #e9dcc4; }
.fp .fp-shop-card { border-color: #ece1cf; }
/* Banner like Lela's reference (2026-10-14): satin, marble and flowers photo, our black box standing on the marble. */
.fp .fp-shop-hero2 { min-height: 232px; border: 0; background: #efe3cf url("/static/shop-hero-bg.webp") 70% center / cover no-repeat; box-shadow: 0 10px 30px rgba(70, 50, 20, .12); }
.fp .fp-shop-hero2::before { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(252, 247, 238, .78) 0%, rgba(252, 247, 238, .45) 42%, rgba(252, 247, 238, 0) 62%); pointer-events: none; }
.fp .fp-shop-hero2-img { mix-blend-mode: normal; left: auto; right: 5%; bottom: -3%; top: auto; width: auto; height: 104%; max-width: none; object-fit: contain; -webkit-mask-image: none; mask-image: none; }
.fp .fp-shop-hero2 h1 { font-size: 30px; line-height: 1.08; }
.fp .fp-shop-eyebrow { background: rgba(255, 253, 248, .55); }
.fp .fp-shop-hero2 .fp-btn.fp-shop-cta { background: #fffdf8 !important; color: #15110d !important; -webkit-text-fill-color: #15110d; border: 1px solid #e3d2ae; box-shadow: 0 6px 16px rgba(80, 60, 30, .16); }
.fp .fp-shop-hero2-badge { box-shadow: 0 8px 22px rgba(60, 40, 15, .18); }
.fp:has(.fp-shop-hero2) { background: #fbf7f0; }
@media (min-width: 700px) { .fp .fp-shop-hero2 { min-height: 300px; } .fp .fp-shop-hero2-img { right: 16%; } .fp .fp-shop-hero2 h1 { font-size: 40px; } }
/* Bottom bar in black and gold (reference). */
.fp .fp-nav { background: #12100e !important; border-top: 1px solid #b8964f; }
.fp .fp-nav-in > button { color: #d9b96f; }
.fp .fp-nav-in > button.is-on { color: #f1d592; }
.fp .fp-nav .fp-plus-ring { background: radial-gradient(circle at 35% 30%, #f6e2a8 0%, #d2ad62 45%, #9a7431 100%) !important; color: #fffaf0; box-shadow: 0 6px 18px rgba(201, 163, 90, .45), 0 0 0 3px #12100e; }

/* ---- Webshop start page, Lela's list (2026-10-14): full-width banner and trust row, new sections ---- */
.fp:has(.fp-shop-hero2) { overflow-x: clip; }
.fp .fp-bleed { margin-left: calc(50% - 50vw) !important; margin-right: calc(50% - 50vw) !important; width: 100vw; max-width: none; border-radius: 0 !important; border-left: 0 !important; border-right: 0 !important; }
.fp .fp-shop-hero2.fp-bleed { box-shadow: none; }
.fp .fp-shop-hero2.fp-bleed .fp-shop-hero2-txt { padding-left: 20px; }
.fp .fp-shop-trust.fp-bleed { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0; padding: 0; }
.fp .fp-shop-trust.fp-bleed > div { min-width: 0; display: flex; align-items: center; justify-content: center; gap: 7px; padding: 13px 6px; }
.fp .fp-shop-trust.fp-bleed > div > div { min-width: 0; }
.fp .fp-shop-trust.fp-bleed b { display: block; font-size: 12.5px; line-height: 1.2; overflow-wrap: anywhere; }
.fp .fp-shop-trust.fp-bleed span { font-size: 11.5px; }
.fp .fp-shop-trust.fp-bleed .fp-ico { flex: none; width: 22px; height: 22px; }
.fp .fp-lux-ico { color: #b08a3e; display: inline-flex; width: 26px; height: 26px; }
.fp .fp-lux-ico svg { width: 100%; height: 100%; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.fp .fp-lux-btn { background: #15110d !important; color: #e6c785 !important; -webkit-text-fill-color: #e6c785; border: 1px solid #15110d; letter-spacing: .14em; font-size: 12.5px; padding: 12px 20px; border-radius: 999px; }
.fp .fp-lux-h2 { font-family: var(--serif); font-weight: 500; font-size: 24px; color: #15110d; margin: 0 0 14px; text-align: center; }
.fp .fp-lux-sec { margin: 30px 0 8px; }
/* Om Lela */
.fp .fp-lux-about { margin: 30px 0 8px; display: grid; grid-template-columns: 38% 1fr; gap: 16px; align-items: center; background: #15110d; color: #efe3c8; border-radius: 18px; padding: 16px; border: 1px solid #b8964f; }
.fp .fp-lux-about-img { aspect-ratio: 3 / 4; border-radius: 12px; overflow: hidden; background: radial-gradient(circle at 40% 30%, #2a231b, #12100e); display: grid; place-items: center; border: 1px solid rgba(201, 163, 90, .5); }
.fp .fp-lux-about-img img { width: 100%; height: 100%; object-fit: cover; }
.fp .fp-lux-mono { font-family: var(--serif); font-size: 64px; color: #d9b96f; font-style: italic; }
.fp .fp-lux-kicker { font-size: 10px; letter-spacing: .3em; text-transform: uppercase; color: #c9a35a; }
.fp .fp-lux-about h2 { font-family: var(--serif); font-weight: 500; font-size: 22px; color: #f1d592; margin: 4px 0 8px; }
.fp .fp-lux-about p { font-size: 13.5px; line-height: 1.5; margin: 0 0 8px; color: #e9dcc0; }
.fp .fp-lux-about .fp-lux-btn { background: #e6c785 !important; color: #15110d !important; -webkit-text-fill-color: #15110d; border-color: #e6c785; margin-top: 4px; }
/* Värderingar */
.fp .fp-lux-values { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.fp .fp-lux-value { background: #fffdf8; border: 1px solid #ebdfc9; border-radius: 14px; padding: 14px 12px; text-align: center; }
.fp .fp-lux-value b { display: block; margin: 8px 0 4px; font-family: var(--serif); font-weight: 600; font-size: 15px; color: #15110d; }
.fp .fp-lux-value p { margin: 0; font-size: 12.5px; line-height: 1.45; color: #5a4d3e; }
/* Cruelty free */
.fp .fp-lux-cruelty { margin: 30px 0 8px; text-align: center; background: #fffdf8; border: 1px solid #ebdfc9; border-radius: 18px; padding: 20px 16px; }
.fp .fp-lux-bunny { width: min(320px, 90%); height: auto; display: block; margin: 0 auto 6px; }
.fp .fp-bun { fill: #e9dcc4; stroke: #b08a3e; stroke-width: 1.4; }
.fp .fp-bun .fp-bun-in { fill: #f3d9d4; stroke: none; }
.fp .fp-bun .fp-bun-eye { fill: #15110d; stroke: #15110d; stroke-width: 1.2; }
.fp .fp-bun-text { font-family: var(--serif); font-size: 44px; font-weight: 600; letter-spacing: .08em; fill: #b08a3e; }
.fp .fp-lux-cruelty h2 { font-family: var(--serif); font-weight: 500; font-size: 22px; margin: 6px 0 4px; color: #15110d; }
.fp .fp-lux-cruelty p { margin: 0; color: #5a4d3e; font-size: 13.5px; }
/* Säkra betalningar */
.fp .fp-lux-pay { margin: 22px 0 8px; text-align: center; }
.fp .fp-lux-pay-h { display: inline-flex; align-items: center; gap: 8px; font-size: 15px; color: #15110d; }
.fp .fp-lux-pay-h .fp-lux-ico { width: 22px; height: 22px; }
.fp .fp-lux-chips { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px; margin: 10px 0 8px; }
.fp .fp-lux-chips span { border: 1px solid #e3d2ae; background: #fff; border-radius: 8px; padding: 6px 10px; font-size: 12px; font-weight: 600; color: #15110d; }
.fp .fp-lux-pay p { margin: 0; font-size: 12px; color: #6b5d4c; }
/* FAQ */
.fp .fp-lux-faq details { background: #fffdf8; border: 1px solid #ebdfc9; border-radius: 12px; margin: 0 0 8px; padding: 0 14px; }
.fp .fp-lux-faq summary { cursor: pointer; list-style: none; padding: 14px 24px 14px 0; font-weight: 600; font-size: 14px; color: #15110d; position: relative; }
.fp .fp-lux-faq summary::-webkit-details-marker { display: none; }
.fp .fp-lux-faq summary::after { content: "+"; position: absolute; right: 0; top: 10px; font-size: 20px; color: #b08a3e; }
.fp .fp-lux-faq details[open] summary::after { content: "–"; }
.fp .fp-lux-faq details p { margin: 0 0 14px; font-size: 13.5px; line-height: 1.55; color: #4a3f33; }
/* Prenumerera */
.fp .fp-lux-news { margin: 30px 0 8px; background: #15110d; color: #e9dcc0; border-radius: 18px; padding: 22px 16px; text-align: center; border: 1px solid #b8964f; }
.fp .fp-lux-news h2 { font-family: var(--serif); font-weight: 500; font-size: 22px; color: #f1d592; margin: 0 0 6px; }
.fp .fp-lux-news p { margin: 0 0 14px; font-size: 13.5px; }
.fp .fp-lux-news-row { display: flex; gap: 8px; max-width: 460px; margin: 0 auto; }
.fp .fp-lux-news-row .fp-input { flex: 1; min-width: 0; background: #fffdf8; border-color: #c9a35a; }
.fp .fp-lux-news .fp-lux-btn { background: #e6c785 !important; color: #15110d !important; -webkit-text-fill-color: #15110d; border-color: #e6c785; padding: 12px 16px; }
.fp .fp-lux-trap { position: absolute; left: -9999px; width: 1px; height: 1px; opacity: 0; }
.fp .fp-lux-copy { margin-top: 6px; opacity: .8; }
@media (min-width: 700px) {
  .fp .fp-lux-values { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .fp .fp-lux-about { grid-template-columns: 240px 1fr; padding: 22px; }
  .fp .fp-shop-hero2.fp-bleed .fp-shop-hero2-txt { padding-left: 48px; }
}
/* Cruelty free heading drawn with the bunny behind the C; Om Lela wall to wall (Lela 2026-10-14) */
.fp .fp-bun-text.fp-bun-cf { font-size: 50px; letter-spacing: 0; fill: #15110d; font-weight: 500; }
.fp .fp-lux-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.fp .fp-lux-about.fp-bleed { padding: 20px 16px; }
@media (min-width: 700px) { .fp .fp-lux-about.fp-bleed { padding: 28px max(24px, calc(50vw - 560px)); } }
/* The free-shipping label: tighter so it stays clear of the lash box */
.fp .fp-shop-hero2 .fp-shop-eyebrow { letter-spacing: .06em; font-size: 9.5px; padding: 4px 10px; white-space: nowrap; }
@media (min-width: 700px) { .fp .fp-shop-hero2 .fp-shop-eyebrow { letter-spacing: .14em; font-size: 10.5px; } }
/* The top bar is black and gold on every page: Community, Meddelanden, Profil too (Lela 2026-10-14) */
.fp .fp-top.fp-top-lux .fp-top-title, .fp .fp-top.fp-top-lux h1, .fp .fp-top.fp-top-lux .fp-top-right a { color: #e2c27e; }
.fp .fp-top.fp-top-lux .fp-top-title:not(.fp-brand) { font-family: var(--serif); letter-spacing: .04em; }
.fp .fp-top.fp-top-lux .fp-bell, .fp .fp-top.fp-top-lux .fp-cart { color: #d9b96f; }

/* ---- Lela's list 2 (2026-10-14): webshop black instead of pink, category menu, back link, reviews, facts ---- */
.fp.fp-shopmode { --rose: #15110d; --rose-d: #15110d; --rose-l: #efe6d6; --line: #ebdfc9; }
.fp .fp-shop-wish { display: none !important; }
.fp .fp-back { display: inline-flex; align-items: center; gap: 4px; background: none; border: 0; padding: 10px 0 6px; font: 600 14.5px var(--sans); color: #15110d; cursor: pointer; }
/* Category menu: main categories as pills, the middle level bigger, the lowest level as before */
.fp .fp-shop-tabs { display: flex; gap: 8px; overflow-x: auto; flex-wrap: nowrap; padding: 10px 0 2px; scrollbar-width: none; border-bottom: 0 !important; }
.fp .fp-shop-tabs::-webkit-scrollbar { display: none; }
.fp .fp-shop-tabs button { flex: none; white-space: nowrap; border: 1px solid #d7bd85 !important; background: #fffdf8 !important; color: #15110d !important; border-radius: 999px !important; padding: 8px 15px !important; font-size: 13.5px !important; font-weight: 600; letter-spacing: .02em; box-shadow: none !important; }
.fp .fp-shop-tabs button::after, .fp .fp-shop-tabs button::before { display: none !important; }
.fp .fp-shop-tabs button.is-on { background: #15110d !important; color: #e6c785 !important; border-color: #15110d !important; }
.fp .fp-shop-mid { scrollbar-width: none; }
.fp .fp-shop-mid .fp-chip { flex: none; white-space: nowrap; font-size: 15px; font-weight: 600; padding: 9px 16px; border: 1px solid #d7bd85; background: #fff; color: #15110d; }
.fp .fp-shop-mid .fp-chip.is-on, .fp .fp-shop-low .fp-chip.is-on { background: #15110d; color: #e6c785; border-color: #15110d; }
.fp .fp-shop-low { scrollbar-width: none; }
.fp .fp-shop-low .fp-chip { flex: none; white-space: nowrap; border-color: #e3d2ae; color: #15110d; background: #fffdf8; }
/* Category text under the products */
.fp .fp-shop-intro2 { margin: 22px 0 6px; padding: 16px; background: #fffdf8; border: 1px solid #ebdfc9; border-radius: 14px; }
.fp .fp-shop-intro2 h1 { font-family: var(--serif); font-weight: 500; font-size: 24px; line-height: 1.2; margin: 0 0 6px; color: #15110d; }
.fp .fp-shop-intro2 p { margin: 0; font-size: 14.5px; line-height: 1.6; color: #2b241d; }
/* Readable product text + facts */
.fp.fp-shopmode .fp-rich { font-size: 15.5px; line-height: 1.7; color: #1f1a15; }
.fp.fp-shopmode .fp-rich p { margin: 0 0 12px; }
.fp.fp-shopmode .fp-rich li { margin: 0 0 6px; }
.fp.fp-shopmode .fp-rich strong, .fp.fp-shopmode .fp-rich b { color: #15110d; }
.fp .fp-facts ul { margin: 8px 0 0; padding: 0; list-style: none; display: grid; gap: 6px; }
.fp .fp-facts li { font-size: 15px; color: #1f1a15; padding: 8px 10px; background: #faf6ef; border-radius: 8px; }
.fp .fp-facts li b { color: #15110d; }
/* Reviews */
.fp .fp-rv-box { margin: 30px 0 8px; text-align: center; }
.fp .fp-rv-sum { display: flex; align-items: center; justify-content: center; gap: 8px; margin: 0 0 14px; color: #15110d; }
.fp .fp-rv-sum b { font-size: 18px; }
.fp .fp-rv-sum .fp-stars, .fp .fp-rv-card .fp-stars { color: #b08a3e; }
.fp .fp-rv-row { display: flex; gap: 10px; overflow-x: auto; scroll-snap-type: x mandatory; padding: 2px 2px 10px; text-align: left; scrollbar-width: none; }
.fp .fp-rv-row .fp-rv-card { flex: 0 0 min(280px, 82%); scroll-snap-align: start; }
.fp .fp-rv-card { background: #fffdf8; border: 1px solid #ebdfc9; border-radius: 14px; padding: 14px; display: grid; gap: 6px; align-content: start; }
.fp .fp-rv-top { display: flex; justify-content: space-between; align-items: center; font-size: 12px; color: #6b5d4c; }
.fp .fp-rv-card p { margin: 0; font-size: 14px; line-height: 1.5; color: #1f1a15; }
.fp .fp-rv-who { display: flex; gap: 8px; font-size: 12.5px; color: #4a3f33; }
.fp .fp-rv-ok { color: #6b5d1f; }
.fp .fp-rv-card .fp-link { justify-self: start; padding: 0; font-size: 12.5px; color: #9a7634; }
.fp .fp-rv-box .fp-lux-btn { margin-top: 6px; }
.fp .fp-rv-list { display: grid; gap: 10px; margin: 6px 0 12px; }
/* Webshop buttons: black and gold instead of pink (Lela 2026-10-14) */
.fp.fp-shopmode .fp-btn.fp-rose { background: #15110d !important; color: #e6c785 !important; -webkit-text-fill-color: #e6c785; border-color: #15110d !important; box-shadow: 0 6px 16px rgba(21, 17, 13, .18); }
/* "Utförsäljning" instead of "REA" on the product cards */
.fp .fp-shop-off.fp-shop-off-txt { font-size: 9.5px; letter-spacing: .06em; text-transform: uppercase; padding: 4px 7px; }

/* ---- People search, gold rings, bigger photo of Lela (2026-10-14) ---- */
.fp .fp-ps { position: fixed; inset: 0; z-index: 80; background: rgba(18, 16, 14, .45); display: flex; justify-content: center; align-items: flex-start; padding: calc(env(safe-area-inset-top, 0px) + 10px) 10px 10px; }
.fp .fp-ps-box { width: min(560px, 100%); max-height: 80vh; overflow: auto; background: #fffdf8; border: 1px solid #d7bd85; border-radius: 16px; padding: 12px; box-shadow: 0 18px 40px rgba(0, 0, 0, .25); }
.fp .fp-ps-head { display: flex; gap: 8px; align-items: center; }
.fp .fp-ps-head .fp-input { flex: 1; min-width: 0; border-color: #d7bd85; }
.fp .fp-ps-head .fp-link { color: #15110d; font-weight: 600; }
.fp .fp-ps-list { margin-top: 8px; display: grid; gap: 2px; }
.fp .fp-ps-list .fp-muted { padding: 10px 4px; margin: 0; font-size: 13.5px; }
.fp .fp-ps-row { display: flex; align-items: center; gap: 10px; width: 100%; background: none; border: 0; padding: 8px 6px; border-radius: 10px; text-align: left; cursor: pointer; color: #15110d; }
.fp .fp-ps-row:hover, .fp .fp-ps-row:focus-visible { background: #f5eddf; }
.fp .fp-ps-row .fp-av { width: 40px; height: 40px; flex: none; }
.fp .fp-ps-who { flex: 1; min-width: 0; display: grid; }
.fp .fp-ps-who b, .fp .fp-ps-who small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.fp .fp-ps-who small { color: #6b5d4c; }
.fp .fp-ps-go { font-size: 12px; font-weight: 600; color: #e6c785; background: #15110d; border-radius: 999px; padding: 5px 11px; }
/* Gold rings: stories and every profile picture, like the webshop's category circles */
.fp .fp-story-ring { background: linear-gradient(45deg, #9a7431, #f1d592 50%, #c9a35a); }
.fp .fp-story.seen .fp-story-ring, .fp .fp-story.add .fp-story-ring { background: #e3d2ae; }
.fp .fp-av { box-shadow: 0 0 0 1.5px #d7bd85; }
.fp .fp-story-ring .fp-av { box-shadow: none; }
/* "Mitt namn är Lela": a big photo with a gold edge */
.fp .fp-lux-about { grid-template-columns: 1fr; }
.fp .fp-lux-about-img { width: min(100%, 380px); justify-self: center; aspect-ratio: 4 / 5; border: 2px solid #c9a35a; border-radius: 16px; box-shadow: 0 0 0 5px rgba(201, 163, 90, .18); }
@media (min-width: 700px) { .fp .fp-lux-about { grid-template-columns: 380px 1fr; gap: 32px; } .fp .fp-lux-about-img { width: 100%; } }

/* The photo fills the gold frame (the picture has its own dark edge) */
.fp .fp-lux-about-img img { transform: scale(1.32); transform-origin: 50% 42%; }

/* Om Lela: the photo sits next to the text (also on the phone) */
.fp .fp-lux-about { grid-template-columns: minmax(0, 40%) 1fr; gap: 16px; align-items: center; }
.fp .fp-lux-about-img { width: 100%; justify-self: stretch; }
@media (min-width: 700px) { .fp .fp-lux-about { grid-template-columns: 300px 1fr; gap: 32px; } }

/* Profil: notifications first, then share – nothing else up there */
.fp .fp-top-prof .fp-top-right { display: flex; align-items: center; }
.fp .fp-top-prof .fp-top-right .fp-bell { order: 1; }
.fp .fp-top-prof .fp-top-right .fp-top-extra { order: 2; display: inline-flex; }

/* ==== Community design refinement (Lela 2026-10-14) – look only, no logic changes ====
   Palette: bg #F8F1EC · dark #171311 · gold #D5B875 · powder #E8D3D0 · rosé #955565 · card #FFF · text #302724 / #82736D
   Spacing scale 4 · 8 · 12 · 16 · 24 · radii 10 (small) / 14 (cards) / 999 (pills). */
.fp.fp-commode {
  --bg: #F8F1EC; --card: #FFFFFF; --ink: #302724; --ink-2: #4A3F3B; --muted: #82736D;
  --rose: #955565; --rose-d: #955565; --rose-l: #E8D3D0; --line: #EDE3DC; --gold: #D5B875;
  background: #F8F1EC;
}
/* Header (all pages): calm black, gold accents, even icon sizes and touch areas */
.fp .fp-top.fp-top-lux { background: #171311; border-bottom: 1px solid rgba(213, 184, 117, .45); }
.fp .fp-top.fp-top-lux .fp-icon-btn { width: 40px; height: 40px; display: inline-grid; place-items: center; color: #D5B875; }
.fp .fp-top.fp-top-lux .fp-icon-btn .fp-ico { width: 22px; height: 22px; }
.fp .fp-top.fp-top-lux .fp-top-title.fp-brand { color: #D5B875; }
.fp .fp-top.fp-top-lux .fp-top-sub { color: rgba(213, 184, 117, .8); }
.fp .fp-top.fp-top-lux .fp-dot { min-width: 16px; height: 16px; padding: 0 4px; border-radius: 999px; background: #955565; color: #fff; font-size: 10px; font-weight: 700; line-height: 16px; box-shadow: 0 0 0 2px #171311; }
.fp .fp-top { max-width: 100vw; overflow: hidden; }
/* Feed tabs: lighter, scrollable, thin rosé line under the active tab */
.fp.fp-commode .fp-tabs { display: flex; gap: 4px; overflow-x: auto; scrollbar-width: none; background: rgba(248, 241, 236, .94); border-bottom: 1px solid #EDE3DC; padding: 0 8px; }
.fp.fp-commode .fp-tabs::-webkit-scrollbar { display: none; }
.fp.fp-commode .fp-tabs > button { flex: 1 0 auto; white-space: nowrap; padding: 12px 12px 11px; font-size: 14px; font-weight: 500; color: #82736D; background: none; border: 0; border-bottom: 2px solid transparent; box-shadow: none; }
.fp.fp-commode .fp-tabs > button.is-on { color: #302724; font-weight: 600; border-bottom-color: #955565; }
/* Stories: ~12 % smaller, thin gold rings, even gaps, tidy names */
.fp.fp-commode .fp-stories { gap: 12px; padding: 12px 16px 8px; }
.fp.fp-commode .fp-story-ring { width: 56px; height: 56px; padding: 2px; background: linear-gradient(45deg, #B8984F, #E9D39C 50%, #D5B875); }
.fp.fp-commode .fp-story.seen .fp-story-ring, .fp.fp-commode .fp-story.add .fp-story-ring { background: #E8D3D0; }
.fp.fp-commode .fp-story-ring .fp-av { border: 2px solid #F8F1EC; font-size: 18px; }
.fp.fp-commode .fp-story-name { max-width: 64px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 11.5px; color: #4A3F3B; }
.fp.fp-commode .fp-story.seen .fp-story-name { color: #82736D; }
/* Posts: white editorial cards, compact head, scannable meta */
.fp.fp-commode .fp-stack { gap: 12px; }
.fp.fp-commode .fp-post, .fp.fp-commode .fp-stack > .fp-post { background: #FFFFFF; border: 1px solid #EDE3DC !important; border-radius: 14px !important; margin: 0 0 12px !important; padding: 0 0 2px; overflow: hidden; box-shadow: 0 1px 2px rgba(48, 39, 36, .04); }
.fp.fp-commode .fp-pin { padding: 10px 14px 0; font-size: 11.5px; font-weight: 500; letter-spacing: 0; text-transform: none; color: #82736D; }
.fp.fp-commode .fp-post-head { padding: 12px 14px 10px; gap: 10px; align-items: center; }
.fp.fp-commode .fp-post-head .fp-av { width: 38px; height: 38px; flex: none; }
.fp.fp-commode .fp-post-who { min-width: 0; }
.fp.fp-commode .fp-post-who b { font-size: 14.5px; font-weight: 600; color: #302724; letter-spacing: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 100%; }
.fp.fp-commode .fp-post-time { font-size: 12px; color: #82736D; white-space: nowrap; }
.fp.fp-commode .fp-post-head .fp-icon-btn { width: 36px; height: 36px; color: #82736D; }
.fp.fp-commode .fp-gallery img, .fp.fp-commode .fp-gallery video { display: block; width: 100%; height: auto; max-height: 82vh; object-fit: cover; }
.fp.fp-commode .fp-actions { padding: 6px 6px 2px; gap: 2px; }
.fp.fp-commode .fp-act { min-width: 44px; min-height: 40px; padding: 6px 8px; gap: 5px; color: #302724; font-size: 13px; }
.fp.fp-commode .fp-act .fp-ico { width: 22px; height: 22px; }
.fp.fp-commode .fp-act.on, .fp.fp-commode .fp-act.is-on { color: #955565; }
.fp.fp-commode .fp-post-meta { padding: 0 14px 12px; }
.fp.fp-commode .fp-post-caption { font-size: 14px; line-height: 1.5; color: #302724; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; cursor: pointer; }
.fp.fp-commode .fp-post-caption.is-open { display: block; -webkit-line-clamp: unset; overflow: visible; }
.fp.fp-commode .fp-post-caption b { font-weight: 600; margin-right: 4px; }
.fp.fp-commode .fp-tag { color: #955565; font-weight: 500; }
.fp.fp-commode .fp-post-more { display: block; margin-top: 6px; padding: 2px 0; font-size: 13px; color: #82736D; }
.fp.fp-commode .fp-post-date { margin-top: 4px; font-size: 11.5px; color: #82736D; letter-spacing: 0; text-transform: none; }
.fp.fp-commode .fp-eyebrow { letter-spacing: .06em; }
.fp.fp-commode .fp-card.fp-soft { background: #FFFFFF; border: 1px solid #EDE3DC; box-shadow: none; }
.fp.fp-commode .fp-av { box-shadow: 0 0 0 1px rgba(213, 184, 117, .7); }
.fp.fp-commode .fp-story-ring .fp-av { box-shadow: none; }
/* Bottom bar: balanced, calmer plus button, clear active item, iPhone safe area */
.fp .fp-nav { background: #171311 !important; border-top: 1px solid rgba(213, 184, 117, .35); padding-bottom: env(safe-area-inset-bottom, 0px); }
.fp .fp-nav-in > button { color: rgba(213, 184, 117, .62); font-weight: 500; }
.fp .fp-nav-in > button .fp-ico { width: 23px; height: 23px; }
.fp .fp-nav-in > button.is-on { color: #D5B875; font-weight: 600; }
.fp .fp-nav .fp-plus-ring { width: 42px !important; height: 42px !important; background: linear-gradient(145deg, #E2C98E, #C4A35E) !important; color: #171311 !important; box-shadow: 0 2px 8px rgba(213, 184, 117, .28), 0 0 0 3px #171311 !important; }

/* Small phones: the logo fits between the icons; calm photo background behind images */
@media (max-width: 430px) { .fp .fp-top.fp-top-lux .fp-top-title.fp-brand { font-size: 20px; letter-spacing: .1em !important; } }
.fp.fp-commode .fp-gallery, .fp.fp-commode .fp-gallery button { background: #F3ECE6; }

/* Long profile names fit on small phones instead of breaking mid-word */
.fp .fp-prof-id h2 { font-size: clamp(19px, 5.6vw, 26px); word-break: normal; overflow-wrap: anywhere; line-height: 1.15; }

/* ==== Webshop premium refinement (Lela 2026-10-15) – design system ====
   Type: Playfair Display (headings) + system sans (UI). Colours: black #171311 · champagne #D5B875 · cream #F8F1EC/#F6F0E8 · powder #E8D3D0.
   Spacing 4/8/12/16/24/32 · radius 10 (controls) / 14 (cards) / 999 (pills). */
.fp, .fp-sheet, .fp-toast { --serif: "Playfair Display", Georgia, "Times New Roman", serif; }
.fp :focus-visible { outline: 2px solid #D5B875; outline-offset: 2px; }
/* Compact header stack: bar 52 · offer 32 · search 54 */
.fp .fp-top.fp-top-lux { height: 52px; min-height: 52px; }
.fp .fp-promo { padding: 7px 14px !important; font: 500 13px/1.3 var(--sans) !important; letter-spacing: .01em; cursor: pointer; }
.fp .fp-shop-head2 { padding: 6px 16px 8px; }
.fp .fp-shop-search { height: 42px; font-size: 14.5px; border-radius: 999px; }
/* Product cards: one catalogue – square warm image area, whole product visible, price + buy on one line */
.fp.fp-shopmode .fp-shop-grid { gap: 10px; align-items: stretch; }
.fp.fp-shopmode .fp-shop-card { display: flex; flex-direction: column; padding: 0; border-radius: 14px; border: 1px solid #EFE6DA; background: #FFFFFF; overflow: hidden; box-shadow: 0 1px 2px rgba(23, 19, 17, .04); }
.fp.fp-shopmode .fp-shop-img { position: relative; aspect-ratio: 1 / 1; height: auto; margin: 0; border-radius: 0; background: #F6F0E8; overflow: hidden; }
.fp.fp-shopmode .fp-shop-img img { width: 100%; height: 100%; object-fit: contain; padding: 7%; mix-blend-mode: multiply; }
.fp.fp-shopmode .fp-shop-title { display: block; padding: 10px 12px 0; font-size: 13.5px; line-height: 1.35; font-weight: 500; color: #241E1A; height: auto; min-height: 0; max-height: none; overflow: visible; white-space: normal; text-overflow: clip; -webkit-line-clamp: unset; }
.fp.fp-shopmode .fp-shop-stars { padding: 4px 12px 0; }
.fp.fp-shopmode .fp-shop-stars-empty { display: none; }
.fp.fp-shopmode .fp-shop-foot { margin-top: auto; padding: 10px 12px 12px; display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.fp.fp-shopmode .fp-shop-price { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 6px; min-width: 0; }
.fp.fp-shopmode .fp-shop-price b { font-size: 15px; font-weight: 600; color: #171311; }
.fp.fp-shopmode .fp-shop-price s { font-size: 12.5px; color: #8A7E76; }
.fp.fp-shopmode .fp-shop-buy { width: 36px; height: 36px; flex: none; border-radius: 10px; transition: transform .15s ease, background-color .15s ease; }
.fp.fp-shopmode .fp-shop-buy:active { transform: scale(.92); }
.fp.fp-shopmode .fp-shop-off { top: 8px; left: 8px; padding: 3px 8px; border-radius: 999px; font-size: 10.5px; }
.fp.fp-shopmode .fp-shop-sec-h h2 { font-size: 24px; font-weight: 500; }
@media (hover: hover) { .fp.fp-shopmode .fp-shop-card { transition: box-shadow .2s ease, transform .2s ease; } .fp.fp-shopmode .fp-shop-card:hover { box-shadow: 0 8px 22px rgba(23, 19, 17, .08); transform: translateY(-2px); } }
/* Values: short lines, same icon style */
.fp .fp-lux-value { padding: 14px 12px; }
.fp .fp-lux-value p { font-size: 12.5px; }
/* FAQ: compact, gentle open */
.fp .fp-lux-faq details { margin: 0 0 6px; border-radius: 10px; }
.fp .fp-lux-faq summary { padding: 12px 26px 12px 0; font-size: 14px; }
.fp .fp-lux-faq details[open] p { animation: fpFadeIn .2s ease; }
@keyframes fpFadeIn { from { opacity: 0; transform: translateY(-3px); } to { opacity: 1; transform: none; } }
/* Payments: one tidy row */
.fp .fp-lux-chips span { padding: 5px 9px; font-size: 11.5px; border-radius: 6px; }
/* Newsletter: elegant and lighter */
.fp .fp-lux-news { background: #FFFDF8; color: #4A3F3B; border: 1px solid #E7DCCB; padding: 20px 16px; }
.fp .fp-lux-news h2 { color: #171311; font-size: 20px; }
.fp .fp-lux-news p { color: #6B5D52; font-size: 13px; }
.fp .fp-lux-news .fp-lux-btn { background: #171311 !important; color: #D5B875 !important; -webkit-text-fill-color: #D5B875; border-color: #171311; }
.fp .fp-lux-news-row .fp-input { border-color: #DCCDB3; }
/* Footer: easy to scan */
.fp .fp-shop-foot2 { margin-top: 28px; padding: 18px 0 8px; border-top: 1px solid #E7DCCB; display: grid; gap: 10px; font-size: 12.5px; color: #6B5D52; }
.fp .fp-shop-foot2 nav { display: grid; grid-template-columns: 1fr 1fr; gap: 8px 16px; }
.fp .fp-shop-foot2 nav a { color: #302724; text-decoration: none; font-size: 13.5px; }
.fp .fp-shop-foot2 a[href^="mailto"] { color: #302724; }
@media (prefers-reduced-motion: reduce) { .fp *, .fp *::before, .fp *::after { animation: none !important; transition: none !important; } }

/* Hero on small iPhones: text and lash box never overlap */
@media (max-width: 430px) { .fp .fp-shop-hero2 .fp-shop-hero2-txt { max-width: 50%; } .fp .fp-shop-hero2 h1 { font-size: 28px; } .fp .fp-shop-hero2 p { font-size: 13px; } }
.fp .fp-shop-hero2.fp-bleed { margin-top: -8px; }

/* ==== Lela's mockup (2026-10-15): palette, gold CTAs, trust cards, dark newsletter, social footer ====
   #16120F black · #D9B66C champagne · #F9F4ED cream · #E9C8C7 powder · #BFAE9B accent · #6B4F43 text */
.fp.fp-shopmode { --bg: #F9F4ED; --line: #EADFD2; }
.fp.fp-shopmode { background: #F9F4ED; }
.fp .fp-promo::after { content: " ›"; font-size: 15px; opacity: .85; }
/* Hero CTA: one gold pill */
.fp .fp-shop-hero2 .fp-btn.fp-shop-cta { background: linear-gradient(135deg, #E6C886, #C9A55C) !important; color: #16120F !important; -webkit-text-fill-color: #16120F; border: 0; box-shadow: 0 6px 16px rgba(150, 110, 40, .22); letter-spacing: .12em; font-weight: 600; }
/* Trust row as three small cards */
.fp .fp-shop-trust.fp-bleed { gap: 8px; padding: 10px 12px; background: transparent; border: 0 !important; }
.fp .fp-shop-trust.fp-bleed > div { background: #FFFDF9; border: 1px solid #EADFD2 !important; border-radius: 12px; padding: 10px 6px; }
.fp .fp-shop-trust.fp-bleed > div + div { border-left: 1px solid #EADFD2 !important; }
.fp .fp-shop-trust.fp-bleed > div:nth-child(3) span::after { content: "★★★★★"; display: block; color: #C9A55C; letter-spacing: .08em; font-size: 10px; margin-top: 1px; }
/* Values: serif titles, icons in champagne */
.fp .fp-lux-value b { font-family: var(--serif); font-size: 15.5px; font-weight: 600; }
.fp .fp-lux-ico { color: #C9A55C; }
/* Newsletter: dark card with a thin gold frame, white field, gold pill */
.fp .fp-lux-news { background: #16120F; color: #EFE3CC; border: 1px solid #C9A55C; outline: 1px solid rgba(201, 165, 92, .35); outline-offset: -7px; padding: 24px 18px; }
.fp .fp-lux-news h2 { color: #E6C886; font-size: 24px; }
.fp .fp-lux-news p { color: #EFE3CC; font-size: 13.5px; }
.fp .fp-lux-news-row { flex-direction: column; gap: 10px; }
.fp .fp-lux-news-row .fp-input { background: #FFFFFF; border: 0; border-radius: 999px; padding: 12px 18px; }
.fp .fp-lux-news .fp-lux-btn { background: linear-gradient(135deg, #E6C886, #C9A55C) !important; color: #16120F !important; -webkit-text-fill-color: #16120F; border: 0; width: 100%; }
/* Footer: underlined links, socials */
.fp .fp-shop-foot2 nav a { text-decoration: underline; text-underline-offset: 3px; text-decoration-color: rgba(107, 79, 67, .35); color: #6B4F43; }
.fp .fp-foot-social { display: flex; gap: 14px; margin-top: 2px; }
.fp .fp-foot-social a { color: #16120F; display: inline-flex; }
.fp .fp-foot-social .fp-lux-ico { width: 22px; height: 22px; color: #16120F; }
.fp, .fp-sheet, .fp-toast { --sans: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif; }

/* trust cards: stacked icon + text, stars under third card text */
.fp .fp-shop-trust.fp-bleed > div { flex-direction: column; align-items: center; text-align: center; gap: 4px; min-width: 0; padding: 10px 4px; }
.fp .fp-shop-trust.fp-bleed > div > div { min-width: 0; }
.fp .fp-shop-trust.fp-bleed b { font-size: 11.5px; white-space: nowrap; }
.fp .fp-shop-trust.fp-bleed > div span:not(.fp-ico) { font-size: 10.5px; }
.fp .fp-shop-trust.fp-bleed .fp-ico { color: #C9A55C; }
.fp .fp-shop-trust.fp-bleed > div:nth-child(3) span::after { content: none; }
.fp .fp-shop-trust.fp-bleed > div:nth-child(3) > div > span::after { content: "★★★★★"; display: block; color: #C9A55C; letter-spacing: .08em; font-size: 10px; margin-top: 1px; }

/* ==== New banner photo (Lela 2026-10-14): satin, flowers, Finafransar box – one photo, box no longer a separate layer ==== */
.fp .fp-shop-hero2 { background: #F3E6D3 url("/static/hero-banner-m.jpg") 80% center / cover no-repeat !important; }
@media (min-width: 700px) { .fp .fp-shop-hero2 { background-image: url("/static/hero-banner.jpg") !important; background-position: right center !important; } }
.fp .fp-shop-hero2-img { display: none !important; }
.fp .fp-shop-hero2::before { background: linear-gradient(90deg, rgba(249, 244, 237, .86) 0%, rgba(249, 244, 237, .6) 42%, rgba(249, 244, 237, 0) 64%) !important; }

/* Sticky rows sit flush under the 52px black header (was 56px = 4px gap) */
.fp:has(.fp-top-lux) .fp-tabs, .fp:has(.fp-top-lux) .fp-dm-head, .fp:has(.fp-top-lux) .fp-shop-head { top: 52px; }

/* Tillbaka sits above the category pills (Lela 2026-10-14) */
.fp .fp-shop-head > .fp-back { display: flex; align-items: center; padding: 8px 0 6px; margin: 0; font-size: 14.5px; }

/* ==== Pincetter feature card (Lela's design 2026-10-14) ==== */
.fp .fp-feat { margin: 22px 0 6px; background: #FBF6EF; border: 1px solid #EADFD2; border-radius: 18px; overflow: hidden; box-shadow: 0 6px 20px rgba(60, 40, 20, .06); }
.fp .fp-feat-img { aspect-ratio: 1 / 1; background: #EFE4D4; }
.fp .fp-feat-img img { display: block; width: 100%; height: 100%; object-fit: cover; }
.fp .fp-feat-body { padding: 18px 16px 20px; }
.fp .fp-feat-body h2 { margin: 0 0 14px; font-family: var(--serif); font-size: 32px; font-weight: 500; line-height: 1.05; color: #16120F; }
.fp .fp-feat-row { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 12px; }
.fp .fp-feat-list { list-style: none; margin: 0; padding: 0 12px 0 0; display: grid; gap: 10px; border-right: 1px solid #E3D3BC; }
.fp .fp-feat-list li { display: flex; align-items: center; gap: 10px; font-size: 14px; color: #241E1A; }
.fp .fp-feat-ico { flex: none; width: 36px; height: 36px; border-radius: 50%; border: 1px solid #D9C29A; display: grid; place-items: center; background: #FFFDF9; }
.fp .fp-feat-ico .fp-ico { width: 18px; height: 18px; color: #16120F; }
.fp .fp-feat-ico svg { fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
.fp .fp-btn.fp-feat-btn { background: #16120F !important; color: #E6C886 !important; -webkit-text-fill-color: #E6C886; border: 1px solid #C9A55C; border-radius: 999px; padding: 12px 14px; font-size: 13px; font-weight: 500; line-height: 1.25; max-width: 140px; white-space: normal; text-align: center; box-shadow: 0 6px 14px rgba(22, 18, 15, .18); }
@media (min-width: 420px) { .fp .fp-btn.fp-feat-btn { max-width: none; white-space: nowrap; padding: 13px 20px; font-size: 14px; } }
@media (min-width: 700px) { .fp .fp-feat { display: grid; grid-template-columns: 1fr 1fr; align-items: center; } .fp .fp-feat-body { padding: 28px; } .fp .fp-feat-body h2 { font-size: 40px; } }
.fp .fp-btn.fp-feat-btn { text-transform: none; letter-spacing: 0; font-size: 14px; }

/* SEO guide "Köpa fransar online" (2026-10-14) */
.fp .fp-lux-seo p { font-size: 14px; line-height: 1.6; color: #4A3F3B; margin: 0 0 10px; }
.fp .fp-lux-seo-links { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
.fp .fp-lux-seo-links a { padding: 8px 14px; border: 1px solid #D9C29A; border-radius: 999px; background: #FFFDF9; color: #16120F; font-size: 13.5px; text-decoration: none; }

/* ==== Category circles – Lela's design (2026-10-14): gold ring, photo, name in a cream band ==== */
.fp .fp-shop-cats { gap: 12px; padding: 14px 16px 16px; margin: 0 -16px; background: linear-gradient(180deg, #F6EBDD 0%, #EFDFCB 100%); }
.fp .fp-shop-cats .fp-shop-cat { flex: none; padding: 0; background: none; border: 0; }
.fp .fp-shop-cats .fp-shop-cat > span:not(.fp-shop-cat-img) { display: none; }
.fp .fp-shop-cats .fp-shop-cat-img { position: relative; display: block; width: 112px; height: 112px; padding: 3px; border: 0 !important; border-radius: 50%; background: linear-gradient(140deg, #F6E3A8 0%, #C9A55C 35%, #F3DC9C 60%, #B38A45 100%) !important; box-shadow: 0 6px 16px rgba(110, 80, 40, .22); overflow: hidden; }
.fp .fp-shop-cats .fp-shop-cat-img img { display: block; width: 100%; height: 100%; border-radius: 50%; object-fit: cover; background: #F3E6D6; }
.fp .fp-shop-cats .fp-shop-cat:not(.has-art) .fp-shop-cat-img img { object-fit: contain; padding: 14px 14px 30px; background: radial-gradient(circle at 50% 35%, #FFFBF4, #EEDCC6); mix-blend-mode: normal; }
.fp .fp-shop-cats .fp-shop-cat-band { position: absolute; left: 3px; right: 3px; bottom: 3px; height: 34%; display: flex; align-items: center; justify-content: center; padding: 2px 12px 6px; text-align: center; border-radius: 0 0 999px 999px; background: linear-gradient(180deg, rgba(250, 242, 232, .92) 0%, #F8EEE2 30%); font-family: var(--serif); font-size: 13px; font-weight: 500; line-height: 1.05; color: #16120F; }
.fp .fp-shop-cats .fp-shop-cat:active .fp-shop-cat-img { transform: scale(.96); }
@media (min-width: 700px) { .fp .fp-shop-cats .fp-shop-cat-img { width: 150px; height: 150px; } .fp .fp-shop-cats .fp-shop-cat-band { font-size: 16px; } }
.fp .fp-shop-cats .fp-shop-cat { width: auto !important; min-width: 0; max-width: none; flex: 0 0 auto; }
.fp .fp-shop-cats .fp-shop-cat-img { flex: none; margin: 0 !important; }
.fp .fp-shop-cats .fp-shop-cat-band { font-size: 12.5px; padding: 2px 8px 6px; }
.fp .fp-shop-cats .fp-shop-cat:not(.has-art) .fp-shop-cat-img img { object-fit: cover; padding: 0; background: #F3E6D6; }
@media (min-width: 700px) { .fp .fp-shop-cats .fp-shop-cat-band { font-size: 15px; } }
/* Trust cards on top: less air above, more below */
.fp .fp-shop-trust.fp-bleed:first-child { margin-top: -22px; margin-bottom: 24px; }


/* ---------- Dator (≥1024px): menyn flyttas upp i toppfältet, logga till vänster, ingen bottenmeny ---------- */
@media (min-width: 1024px) {
  .fp .fp-top { grid-template-columns: 56px auto 1fr auto; column-gap: 12px; }
  .fp .fp-top > .fp-brand, .fp .fp-top > .fp-top-title { justify-self: start; text-align: left; align-items: flex-start; }
  .fp .fp-nav { top: 0; bottom: auto; left: 50%; right: auto; transform: translateX(-50%); width: auto; height: 52px; z-index: 25; background: transparent !important; border: 0 !important; backdrop-filter: none; -webkit-backdrop-filter: none; box-shadow: none; padding: 0; }
  .fp .fp-nav-in { display: flex; align-items: center; gap: 6px; width: auto; max-width: none; height: 52px; }
  .fp .fp-nav button { flex-direction: row; gap: 8px; height: 38px; padding: 0 14px; border-radius: 999px; font-size: 13.5px; font-weight: 500; letter-spacing: .02em; color: #f8efeb; opacity: .82; }
  .fp .fp-nav button:hover { opacity: 1; background: rgba(213,184,117,.12); }
  .fp .fp-nav button.is-on { color: #d5b875; opacity: 1; font-weight: 600; }
  .fp .fp-nav button svg { width: 18px; height: 18px; }
  .fp .fp-nav .fp-nav-plus { padding: 0 6px; }
  .fp .fp-nav .fp-plus-ring { width: 32px; height: 32px; margin: 0; }
  .fp .fp-nav .fp-plus-ring svg { width: 18px; height: 18px; }
  .fp .fp-page { padding-bottom: 40px; }
}
/* Mindre datorskärmar: bara ikoner i menyn så den inte krockar med loggan */
@media (min-width: 1024px) and (max-width: 1199px) {
  .fp .fp-nav button > span:not([class]) { display: none; }
  .fp .fp-nav button { padding: 0 12px; }
}


/* ---------- Produktrader på dator: 2 i mobilen, 4 på mellanstora skärmar, 5 på stora – alltid centrerade ---------- */
@media (max-width: 719px) {
  .fp .fp-shop-grid.fp-row5 > :nth-child(n+3) { display: none; }
}
@media (min-width: 720px) {
  .fp .fp-shop-grid { display: flex; flex-wrap: wrap; justify-content: center; gap: 16px; }
  .fp .fp-shop-grid > * { flex: 0 1 calc((100% - 3 * 16px) / 4); min-width: 0; }
}
@media (min-width: 720px) and (max-width: 1279px) {
  .fp .fp-shop-grid.fp-row5 > :nth-child(n+5) { display: none; }
}
@media (min-width: 1280px) {
  .fp .fp-shop-grid > * { flex-basis: calc((100% - 4 * 16px) / 5); }
  .fp .fp-shop-grid.fp-row5 > :nth-child(n+6) { display: none; }
}
/* deploy 2026-10-14 */


/* ---------- Dator: hela bannerbilden syns + kategoricirklarna får plats, allt centrerat ---------- */
@media (min-width: 1024px) {
  .fp .fp-shop-hero2.fp-bleed { width: auto; max-width: 1360px; margin: 16px auto 20px !important; left: auto; right: auto; transform: none; aspect-ratio: 1672 / 941; height: auto !important; min-height: 0 !important; max-height: 78vh; border-radius: 22px; background-size: cover !important; background-position: right center !important; display: flex; align-items: center; }
  .fp .fp-shop-cats { justify-content: center; flex-wrap: nowrap; overflow: visible; max-width: 1360px; margin: 0 auto 20px !important; border-radius: 22px; }
  .fp .fp-shop-cats .fp-shop-cat { flex: 0 1 auto !important; min-width: 0; }
  .fp .fp-shop-cats .fp-shop-cat-img { width: clamp(96px, calc((min(100vw, 1360px) - 220px) / 9), 132px) !important; height: clamp(96px, calc((min(100vw, 1360px) - 220px) / 9), 132px) !important; }
}

/* ==== PREMIUM MOBILE UI (Lela's brief 2026-10-15) – one token layer for the webshop ====
   espresso #17120F · ivory #F7F1E9 · champagne #D5B66E · sand #E8DDD0 · text #211A16 / #786F68 · white */
.fp.fp-shopmode { --ff-espresso: #17120F; --ff-ivory: #F7F1E9; --ff-gold: #D5B66E; --ff-gold-d: #B8954A; --ff-sand: #E8DDD0; --ff-ink: #211A16; --ff-muted: #786F68;
  --bg: #F7F1E9; --ink: #211A16; --muted: #786F68; --line: #E8DDD0; --card: #FFFFFF; --ff-r: 14px; --ff-r-sm: 10px; background: #F7F1E9; color: #211A16; }
/* Header + announcement bar: compact, even icons */
.fp .fp-top.fp-top-lux { height: 50px; min-height: 50px; background: #17120F; border-bottom: 1px solid rgba(213, 182, 110, .35); }
.fp:has(.fp-top-lux) .fp-tabs, .fp:has(.fp-top-lux) .fp-dm-head, .fp:has(.fp-top-lux) .fp-shop-head { top: 50px; }
.fp .fp-top.fp-top-lux .fp-icon-btn .fp-ico { width: 21px; height: 21px; }
.fp .fp-top.fp-top-lux .fp-icon-btn .fp-ico svg { stroke-width: 1.6; }
.fp .fp-promo { padding: 6px 14px !important; font: 500 12.5px/1.3 var(--sans) !important; background: #17120F !important; color: #EAD9B0 !important; border-bottom: 1px solid rgba(213, 182, 110, .25); }
/* Search: warm white, thin sand border, lower */
.fp.fp-shopmode .fp-shop-head, .fp.fp-shopmode .fp-shop-head2 { background: rgba(247, 241, 233, .96); padding: 8px 16px; }
.fp .fp-shop-search { height: 40px !important; min-height: 40px; background: #FFFDF9 !important; border: 1px solid #E8DDD0 !important; box-shadow: none !important; font-size: 14px; }
.fp .fp-shop-search:focus { border-color: #D5B66E !important; outline: none; }
/* Trust cards: one compact row, equal heights */
.fp .fp-shop-trust.fp-bleed { gap: 8px; padding: 0 16px; }
.fp .fp-shop-trust.fp-bleed:first-child { margin-top: -6px; margin-bottom: 18px; }
.fp .fp-shop-trust.fp-bleed > div { padding: 8px 4px; gap: 2px; border-radius: 12px; background: #FFFFFF; border: 1px solid #EFE6DA !important; justify-content: center; min-height: 0; }
.fp .fp-shop-trust.fp-bleed .fp-ico { width: 18px; height: 18px; color: #C9A55C; }
.fp .fp-shop-trust.fp-bleed b { font-size: 11px; font-weight: 600; color: #211A16; }
.fp .fp-shop-trust.fp-bleed > div span:not(.fp-ico) { font-size: 10px; color: #786F68; line-height: 1.25; }
.fp .fp-shop-trust.fp-bleed > div:nth-child(3) > div > span::after { content: none !important; }
.fp .fp-shop-trust.fp-bleed .fp-trust-score { color: #A9843E !important; font-weight: 600; letter-spacing: .01em; }
@media (max-width: 340px) { .fp .fp-shop-trust.fp-bleed { gap: 6px; padding: 0 12px; } .fp .fp-shop-trust.fp-bleed b { font-size: 10px; white-space: normal; } }
/* Hero: balanced split, natural line breaks, prominent but compact CTA */
.fp .fp-shop-hero2 h1 { font-family: var(--serif); font-weight: 500; font-size: 27px; line-height: 1.1; letter-spacing: -.005em; color: #17120F; text-wrap: balance; }
.fp .fp-shop-hero2 p { color: #4A3F38; font-size: 13.5px; line-height: 1.45; }
.fp .fp-shop-hero2 .fp-btn.fp-shop-cta { background: #17120F !important; color: #EAD9B0 !important; -webkit-text-fill-color: #EAD9B0; border: 1px solid #D5B66E; box-shadow: 0 6px 16px rgba(23, 18, 15, .18); padding: 11px 18px; font-size: 12.5px; letter-spacing: .12em; }
.fp .fp-shop-hero2-txt { max-width: 52%; }
@media (max-width: 340px) { .fp .fp-shop-hero2 h1 { font-size: 23px; } .fp .fp-shop-hero2-txt { max-width: 56%; } .fp .fp-shop-hero2 p { font-size: 12.5px; } }
@media (min-width: 400px) { .fp .fp-shop-hero2 h1 { font-size: 30px; } }
/* Category carousel: identical circles, thin gold outline, label underneath, a peek of the next item */
.fp .fp-shop-cats { gap: 14px; padding: 16px 16px 12px; margin: 0 -16px; background: transparent; scroll-snap-type: x proximity; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
.fp .fp-shop-cats::-webkit-scrollbar { display: none; }
.fp .fp-shop-cats .fp-shop-cat { display: flex; flex-direction: column; align-items: center; gap: 8px; width: 84px !important; flex: 0 0 84px; scroll-snap-align: start; }
.fp .fp-shop-cats .fp-shop-cat-img { width: 84px; height: 84px; padding: 0; background: #F3EADF !important; border: 1px solid #D5B66E !important; box-shadow: 0 0 0 3px #F7F1E9, 0 0 0 4px rgba(213, 182, 110, .45); }
.fp .fp-shop-cats .fp-shop-cat-img img, .fp .fp-shop-cats .fp-shop-cat:not(.has-art) .fp-shop-cat-img img { object-fit: cover; padding: 0; background: #F3EADF; }
.fp .fp-shop-cats .fp-shop-cat-band { position: static; height: auto; padding: 0; background: none; border-radius: 0; display: none; }
.fp .fp-shop-cats .fp-shop-cat > span:not(.fp-shop-cat-img) { display: none; }
.fp .fp-shop-cats .fp-shop-cat-lbl { display: block !important; max-width: 92px; font: 500 12px/1.2 var(--sans); color: #211A16; text-align: center; white-space: nowrap; }
@media (min-width: 700px) { .fp .fp-shop-cats .fp-shop-cat { width: 112px !important; flex-basis: 112px; } .fp .fp-shop-cats .fp-shop-cat-img { width: 112px; height: 112px; } .fp .fp-shop-cats .fp-shop-cat-lbl { font-size: 13.5px; max-width: 120px; } }
/* Section headings + product grid */
.fp.fp-shopmode .fp-shop-sec-h { align-items: baseline; }
.fp.fp-shopmode .fp-shop-sec-h h2 { font-family: var(--serif); font-size: 23px; font-weight: 500; color: #17120F; }
.fp.fp-shopmode .fp-shop-sec-h .fp-link { color: #A9843E; font-size: 13px; font-weight: 600; }
.fp.fp-shopmode .fp-shop-card { border: 1px solid #EFE6DA; border-radius: 14px; box-shadow: none; }
.fp.fp-shopmode .fp-shop-img { background: #F3EADF; }
.fp.fp-shopmode .fp-shop-buy { background: #17120F; color: #EAD9B0; }
/* Bottom navigation: espresso, gold outline icons, small labels, safe area */
.fp .fp-nav { background: #17120F !important; border-top: 1px solid rgba(213, 182, 110, .3); padding-bottom: env(safe-area-inset-bottom, 0px); }
.fp .fp-nav-in > button { color: rgba(213, 182, 110, .6); font-size: 10.5px; letter-spacing: .01em; }
.fp .fp-nav-in > button .fp-ico { width: 22px; height: 22px; }
.fp .fp-nav-in > button.is-on { color: #D5B66E; }
.fp .fp-nav .fp-plus-ring { background: linear-gradient(145deg, #E4C985, #C6A257) !important; }
.fp.fp-shopmode { padding-bottom: calc(84px + env(safe-area-inset-bottom, 0px)); }
@media (prefers-reduced-motion: no-preference) { .fp.fp-shopmode .fp-shop-cat-img, .fp.fp-shopmode .fp-shop-card { transition: transform .18s ease; } }
/* Premium UI fixes after device check (320/375/390/430) */
.fp .fp-shop-search { background-image: url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 24 24%27 fill=%27none%27 stroke=%27%23B8954A%27 stroke-width=%272%27 stroke-linecap=%27round%27%3E%3Ccircle cx=%2711%27 cy=%2711%27 r=%277%27/%3E%3Cpath d=%27m20 20-3.5-3.5%27/%3E%3C/svg%3E") !important; background-repeat: no-repeat !important; background-position: 15px center !important; background-size: 17px 17px !important; }
.fp .fp-shop-cats { margin: 0 !important; }
.fp .fp-shop-hero2 .fp-btn.fp-shop-cta { white-space: nowrap; padding: 10px 16px; font-size: 12px; letter-spacing: .1em; }
@media (max-width: 360px) {
  .fp .fp-top.fp-top-lux { grid-template-columns: 76px 1fr 76px; padding: 0 4px; }
  .fp .fp-top.fp-top-lux .fp-top-title.fp-brand { font-size: 17px !important; letter-spacing: .08em !important; }
  .fp .fp-top.fp-top-lux .fp-top-sub { font-size: 7.5px !important; letter-spacing: .22em !important; }
  .fp .fp-promo { font-size: 11.5px !important; padding: 6px 8px !important; }
}

/* ==== Reference screen (Lela 2026-10-15): trust row, bigger editorial hero, gold CTA, ringed category photos ==== */
.fp .fp-shop-trust.fp-bleed > div:nth-child(3) b { font-size: 10.5px; white-space: normal; line-height: 1.2; }
.fp .fp-shop-trust.fp-bleed .fp-trust-stars { font-style: normal; color: #C9A55C; letter-spacing: .03em; font-size: 10px; margin-right: 2px; }
.fp .fp-shop-trust.fp-bleed .fp-trust-score { color: #786F68 !important; font-weight: 500; white-space: nowrap; }
@media (min-width: 370px) {
  .fp .fp-shop-trust.fp-bleed > div { flex-direction: row; align-items: center; justify-content: flex-start; text-align: left; gap: 7px; padding: 10px 8px; }
  .fp .fp-shop-trust.fp-bleed > div > div { display: flex; flex-direction: column; gap: 2px; }
  .fp .fp-shop-trust.fp-bleed .fp-ico { width: 21px; height: 21px; flex: none; }
  .fp .fp-shop-trust.fp-bleed b { font-size: 11.5px; }
}
.fp .fp-shop-hero2 { min-height: min(80vw, 440px); align-items: center; }
.fp .fp-shop-hero2-txt { max-width: 56%; }
.fp .fp-shop-hero2 h1 { font-size: clamp(28px, 9.4vw, 44px); line-height: 1.02; letter-spacing: -.01em; margin: 10px 0 10px; }
.fp .fp-shop-hero2 p { font-size: clamp(13px, 3.6vw, 16px); color: #3B312B; margin: 0 0 16px; }
.fp .fp-shop-eyebrow { border: 1px solid #C9A55C !important; background: rgba(255, 252, 246, .6) !important; color: #211A16 !important; font-size: 10.5px; letter-spacing: .1em; padding: 5px 11px; }
.fp .fp-shop-hero2 .fp-btn.fp-shop-cta { background: linear-gradient(135deg, #E9CD8E 0%, #CDA75D 55%, #B8954A 100%) !important; color: #17120F !important; -webkit-text-fill-color: #17120F; border: 0; border-radius: 999px; padding: 13px 22px; font-size: 13px; font-weight: 600; letter-spacing: .14em; box-shadow: 0 8px 18px rgba(150, 110, 40, .28), inset 0 1px 0 rgba(255, 255, 255, .45); }
@media (max-width: 340px) { .fp .fp-shop-hero2 .fp-btn.fp-shop-cta { padding: 11px 16px; font-size: 11.5px; letter-spacing: .1em; } }
.fp .fp-shop-cats { gap: 10px; padding: 18px 16px 10px; }
.fp .fp-shop-cats .fp-shop-cat { width: 80px !important; flex: 0 0 80px; gap: 9px; }
.fp .fp-shop-cats .fp-shop-cat-img { width: 80px; height: 80px; padding: 2px; border: 0 !important; background: linear-gradient(140deg, #F3DDA0 0%, #C9A55C 40%, #F1D898 65%, #B08A45 100%) !important; box-shadow: 0 5px 12px rgba(110, 80, 40, .18) !important; }
.fp .fp-shop-cats .fp-shop-cat-lbl { font-family: var(--serif) !important; font-size: 13.5px !important; font-weight: 400 !important; color: #211A16; max-width: 96px; }
@media (min-width: 700px) { .fp .fp-shop-cats .fp-shop-cat { width: 120px !important; flex-basis: 120px; } .fp .fp-shop-cats .fp-shop-cat-img { width: 120px; height: 120px; } .fp .fp-shop-cats .fp-shop-cat-lbl { font-size: 15px !important; max-width: 130px; } }
.fp.fp-shopmode .fp-shop-sec-h h2 { font-size: 25px; }
.fp.fp-shopmode .fp-shop-sec-h .fp-link { color: #211A16; font-weight: 500; }
/* Hero headline breaks like the reference: "Fransar som / lyfter varje / blick." */
.fp .fp-shop-hero2 .fp-shop-hero2-txt { max-width: 60% !important; }
.fp .fp-shop-hero2 h1 { font-size: clamp(26px, 8.4vw, 42px); text-wrap: wrap; }
.fp .fp-shop-trust.fp-bleed:first-child { margin-top: -14px; margin-bottom: 16px; }

/* ==== PREMIUM MOBILE WEBSHOP v2 (Lela's brief 2026-10-15) ====
   black #12100D · champagne #D4AF6A · warm beige #F8EDE4 · white · taupe #EADCCF · muted beige #C9A693 · spacing 8/12/16/24/32 */
.fp.fp-shopmode { --ff-black: #12100D; --ff-gold: #D4AF6A; --ff-beige: #F8EDE4; --ff-taupe: #EADCCF; --ff-accent: #C9A693;
  --bg: #F8EDE4; --line: #EADCCF; background: #F8EDE4; }
/* Header: grid that never overlaps, thin divider */
.fp .fp-top.fp-top-lux { display: grid; grid-template-columns: 51px minmax(0, 1fr) 92px !important; padding: 0 4px !important; height: 54px; min-height: 54px; background: #12100D; border-bottom: 1px solid rgba(212, 175, 106, .32); }
.fp .fp-top.fp-top-lux > :first-child { justify-self: start; }
.fp .fp-top.fp-top-lux > :last-child { justify-self: end; display: flex; gap: 2px; }
.fp .fp-top.fp-top-lux .fp-top-title.fp-brand { min-width: 0; overflow: hidden; text-align: center; color: #D4AF6A; font-size: clamp(17px, 5.4vw, 22px) !important; letter-spacing: .1em !important; }
.fp .fp-top.fp-top-lux .fp-top-sub { font-size: clamp(7.5px, 2vw, 9px) !important; letter-spacing: .26em !important; color: rgba(212, 175, 106, .85); white-space: nowrap; }
.fp .fp-top.fp-top-lux .fp-icon-btn { width: 44px; height: 44px; color: #D4AF6A; }
.fp:has(.fp-top-lux) .fp-tabs, .fp:has(.fp-top-lux) .fp-dm-head, .fp:has(.fp-top-lux) .fp-shop-head { top: 54px; }
.fp .fp-promo { background: #12100D !important; color: #EBD9B2 !important; }
/* Search: own row, ~54px tall area, 20px side margins */
.fp.fp-shopmode .fp-shop-head, .fp.fp-shopmode .fp-shop-head2 { padding: 10px 20px; background: rgba(248, 237, 228, .97); }
.fp .fp-shop-search { height: 50px !important; min-height: 50px; border-radius: 16px !important; background-color: #FFFBF7 !important; border: 1px solid #EADCCF !important; color: #12100D; font-size: 15px; padding-left: 46px !important; background-position: 17px center !important; }
.fp .fp-shop-search::placeholder { color: #8C7F75; }
.fp .fp-shop-search:focus-visible { outline: 2px solid #D4AF6A; outline-offset: 1px; }
/* Trust row: 16px side margins, consistent */
.fp .fp-shop-trust.fp-bleed { padding: 0 16px; }
.fp .fp-shop-trust.fp-bleed .fp-ico { color: #B8954A; }
/* Hero */
.fp .fp-shop-hero2 h1 { color: #12100D; }
.fp .fp-shop-hero2 .fp-btn.fp-shop-cta { border-radius: 14px; background: linear-gradient(135deg, #E6C98B 0%, #D4AF6A 55%, #BE9853 100%) !important; color: #12100D !important; -webkit-text-fill-color: #12100D; transition: transform .12s ease, box-shadow .12s ease; }
.fp .fp-shop-hero2 .fp-btn.fp-shop-cta:active { transform: scale(.97); box-shadow: 0 3px 8px rgba(150, 110, 40, .25); }
/* Categories: same size, thin champagne border */
.fp .fp-shop-cats { padding: 24px 16px 8px; }
.fp .fp-shop-cats .fp-shop-cat-img { padding: 0 !important; background: #EFE3D6 !important; border: 1.5px solid #D4AF6A !important; box-shadow: 0 4px 10px rgba(110, 80, 40, .12) !important; }
.fp .fp-shop-cats .fp-shop-cat:active .fp-shop-cat-img { transform: scale(.96); }
/* Popular products: two equal cards, bigger product, white info, compact gold buy */
.fp.fp-shopmode .fp-shop-sec { margin-top: 24px; padding: 0 16px; }
.fp.fp-shopmode .fp-shop-sec-h { margin-bottom: 12px; }
.fp.fp-shopmode .fp-shop-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.fp.fp-shopmode .fp-shop-card { border-radius: 20px; border: 1px solid #EADCCF; background: #FFFFFF; box-shadow: 0 2px 10px rgba(60, 40, 20, .05); }
.fp.fp-shopmode .fp-shop-img { background: #F3E7DC; }
.fp.fp-shopmode .fp-shop-img img { padding: 4%; object-fit: contain; }
.fp.fp-shopmode .fp-shop-title { font-size: 14px; font-weight: 500; color: #12100D; padding: 12px 12px 0; }
.fp.fp-shopmode .fp-shop-price b { font-size: 16px; color: #12100D; }
.fp.fp-shopmode .fp-shop-price s { font-size: 12px; color: #8C7F75; }
.fp.fp-shopmode .fp-shop-off { padding: 3px 7px !important; font-size: 9px !important; letter-spacing: .08em; font-weight: 600; background: #12100D !important; color: #E3C783 !important; border-radius: 6px !important; }
.fp.fp-shopmode .fp-shop-buy { width: 38px; height: 38px; border-radius: 12px; background: linear-gradient(135deg, #E6C98B, #D4AF6A) !important; color: #12100D !important; border: 0; }
.fp.fp-shopmode .fp-shop-buy:active { transform: scale(.92); }
@media (max-width: 340px) { .fp.fp-shopmode .fp-shop-grid { gap: 8px; } .fp.fp-shopmode .fp-shop-sec { padding: 0 12px; } .fp.fp-shopmode .fp-shop-title { font-size: 13px; padding: 10px 10px 0; } .fp.fp-shopmode .fp-shop-foot { padding: 8px 10px 10px; } }
@media (min-width: 700px) { .fp.fp-shopmode .fp-shop-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; } }
/* Bottom nav: black, champagne icons, smaller plus */
.fp .fp-nav { background: #12100D !important; border-top: 1px solid rgba(212, 175, 106, .28); }
.fp .fp-nav-in > button { color: rgba(212, 175, 106, .58); transition: color .15s ease; }
.fp .fp-nav-in > button.is-on { color: #D4AF6A; }
.fp .fp-nav .fp-plus-ring { width: 40px !important; height: 40px !important; background: linear-gradient(145deg, #E6C98B, #C9A257) !important; color: #12100D !important; }
@media (prefers-reduced-motion: reduce) { .fp .fp-shop-hero2 .fp-btn.fp-shop-cta, .fp .fp-nav-in > button { transition: none; } }
/* Trust cards: stacked under 400px so "Snabb leverans" never clips */
@media (max-width: 399px) { .fp .fp-shop-trust.fp-bleed > div { flex-direction: column !important; align-items: center !important; text-align: center !important; gap: 3px !important; padding: 8px 4px !important; } .fp .fp-shop-trust.fp-bleed > div > div { align-items: center; } .fp .fp-shop-trust.fp-bleed .fp-ico { width: 18px !important; height: 18px !important; } .fp .fp-shop-trust.fp-bleed b { font-size: 11px !important; } }
/* From Lela's iPhone screenshot: trust text had no margin, too much air under the hero */
@media (min-width: 400px) { .fp .fp-shop-trust.fp-bleed > div { gap: 6px; padding: 10px 7px; } .fp .fp-shop-trust.fp-bleed .fp-ico { width: 19px; height: 19px; } .fp .fp-shop-trust.fp-bleed b { font-size: 11px; } .fp .fp-shop-trust.fp-bleed > div > div { min-width: 0; } }
.fp .fp-shop-hero2 { margin-bottom: 8px !important; }
.fp .fp-shop-cats { padding-top: 12px !important; }
/* Trust row: exactly as wide as the search box (page 16px + 4px = search's 20px), 8px under it, cards close together */
.fp .fp-shop-trust.fp-bleed:first-child { margin: -30px 4px 16px !important; padding: 0 !important; gap: 6px !important; width: auto !important; }

/* "Hämta appen"-banner (2026-10-15) – iPhone-webbläsare, överst, trycker ner sidan */
.ff-appbanner { position: relative; z-index: 30; box-sizing: border-box; display: flex; align-items: center; gap: 9px; width: 100%; max-width: 640px; margin: 0 auto; padding: 8px 12px 8px 6px; padding-top: calc(8px + env(safe-area-inset-top, 0px)); background: #FFFFFF; border-bottom: 1px solid #EADCCF; font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif; -webkit-tap-highlight-color: transparent; }
.ff-appbanner .ff-ab-x { flex: none; width: 30px; height: 30px; margin: 0; padding: 0; border: 0; background: none; color: #786F68; font-size: 22px; line-height: 1; cursor: pointer; }
.ff-appbanner .ff-ab-ico { flex: none; width: 40px; height: 40px; border-radius: 10px; object-fit: cover; box-shadow: 0 0 0 1px rgba(18, 16, 13, .08); }
.ff-appbanner .ff-ab-txt { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 1px; line-height: 1.25; }
.ff-appbanner .ff-ab-txt b { font-size: 14px; font-weight: 600; color: #12100D; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ff-appbanner .ff-ab-txt span { font-size: 11.5px; color: #786F68; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.ff-appbanner .ff-ab-get { flex: none; padding: 8px 16px; border-radius: 999px; background: linear-gradient(135deg, #E6C98B 0%, #D4AF6A 60%, #C29E57 100%); color: #12100D; font-size: 14px; font-weight: 600; text-decoration: none; box-shadow: 0 2px 6px rgba(150, 110, 40, .25); }
.ff-appbanner .ff-ab-get:active, .ff-appbanner .ff-ab-x:active { opacity: .75; }
/* Lela 2026-10-15: CTA ends further left (clear of the box), "Snabb leverans" sits further left in its card */
.fp .fp-shop-hero2 .fp-btn.fp-shop-cta { padding: 13px 18px; letter-spacing: .1em; }
@media (min-width: 400px) { .fp .fp-shop-trust.fp-bleed > div { padding-left: 6px !important; padding-right: 6px !important; gap: 5px !important; } }

/* App welcome gift card (2026-10-15) */
.fp .fp-welcome { display: flex; align-items: center; gap: 12px; margin: 4px 4px 14px; padding: 12px 14px; border-radius: 16px; background: #12100D; color: #F3E3BE; border: 1px solid rgba(212, 175, 106, .55); box-shadow: 0 6px 16px rgba(18, 16, 13, .15); }
.fp .fp-welcome-ico { flex: none; width: 38px; height: 38px; display: grid; place-items: center; border-radius: 50%; background: linear-gradient(135deg, #E6C98B, #D4AF6A); font-size: 19px; }
.fp .fp-welcome > div { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.fp .fp-welcome b { font-size: 14px; font-weight: 600; color: #E6C98B; line-height: 1.25; }
.fp .fp-welcome span:not(.fp-welcome-ico) { font-size: 11.5px; line-height: 1.4; color: rgba(243, 227, 190, .85); }
.fp .fp-welcome-note { margin: 10px 0 0; padding: 9px 12px; border-radius: 12px; background: #FFF8EA; border: 1px solid #EAD7AE; color: #5B4A2E; font-size: 13px; }

/* "Ladda ner appen"-popup (2026-10-15) */
.ff-apppop { position: fixed; inset: 0; z-index: 2000; display: flex; align-items: center; justify-content: center; padding: 20px; background: rgba(18, 16, 13, .55); opacity: 0; transition: opacity .2s ease; font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif; }
.ff-apppop.is-on { opacity: 1; }
.ff-apppop .ff-ap-box { position: relative; box-sizing: border-box; width: 100%; max-width: 360px; padding: 28px 22px 18px; border-radius: 22px; background: #F8EDE4; text-align: center; box-shadow: 0 20px 50px rgba(0, 0, 0, .3); border: 1px solid #EADCCF; transform: translateY(10px); transition: transform .2s ease; }
.ff-apppop.is-on .ff-ap-box { transform: none; }
.ff-apppop .ff-ap-x { position: absolute; top: 8px; right: 10px; width: 36px; height: 36px; border: 0; background: none; color: #786F68; font-size: 26px; line-height: 1; cursor: pointer; }
.ff-apppop .ff-ap-ico { display: block; width: 64px; height: 64px; margin: 0 auto 12px; border-radius: 16px; box-shadow: 0 4px 12px rgba(18, 16, 13, .15); }
.ff-apppop .ff-ap-tag { display: inline-block; margin-bottom: 10px; padding: 4px 10px; border-radius: 999px; background: #12100D; color: #E6C98B; font-size: 11px; font-weight: 600; letter-spacing: .1em; }
.ff-apppop h2 { margin: 0 0 8px; font-family: "Playfair Display", Georgia, serif; font-weight: 500; font-size: 23px; line-height: 1.2; color: #12100D; }
.ff-apppop p { margin: 0 0 18px; font-size: 13.5px; line-height: 1.5; color: #5E544D; }
.ff-apppop .ff-ap-get { display: block; padding: 14px 18px; border-radius: 14px; background: linear-gradient(135deg, #E6C98B 0%, #D4AF6A 60%, #C29E57 100%); color: #12100D; font-size: 15px; font-weight: 600; letter-spacing: .02em; text-decoration: none; box-shadow: 0 6px 16px rgba(150, 110, 40, .28); }
.ff-apppop .ff-ap-no { margin-top: 10px; padding: 8px 12px; border: 0; background: none; color: #786F68; font-size: 13px; cursor: pointer; }
.ff-apppop .ff-ap-get:active, .ff-apppop .ff-ap-no:active { opacity: .8; }
@media (prefers-reduced-motion: reduce) { .ff-apppop, .ff-apppop .ff-ap-box { transition: none; } }

/* Appvälkomst-popup i appen: knappen är en <button> */
.ff-apppop button.ff-ap-get { width: 100%; border: 0; font-family: inherit; cursor: pointer; margin-top: 4px; }

/* Veckans tävling "Vinn 1 000 kr" – regler i menyn */
.fp .fp-menu-vinn, .fp-menu-vinn { background: linear-gradient(135deg, #12100D 0%, #2a2219 100%) !important; color: #F3E3BE !important; border: 1px solid #D4AF6A !important; font-weight: 600; }
.fp-menu-vinn svg { color: #D4AF6A; }
.fp-vinn { padding: 4px 4px 8px; color: #2b2320; }
.fp-vinn-tag { display: inline-block; padding: 4px 10px; border-radius: 999px; background: #12100D; color: #D4AF6A; font-size: 11px; font-weight: 700; letter-spacing: .12em; }
.fp-vinn h2 { margin: 10px 0 6px; font-size: 26px; line-height: 1.15; color: #12100D; }
.fp-vinn-lead { margin: 0 0 14px; font-size: 15px; line-height: 1.45; }
.fp-vinn h3 { margin: 16px 0 6px; font-size: 13px; letter-spacing: .08em; text-transform: uppercase; color: #9a7a3c; }
.fp-vinn ol, .fp-vinn ul { margin: 0; padding-left: 20px; }
.fp-vinn li { margin: 0 0 7px; font-size: 14px; line-height: 1.45; }

/* Tävlingspopup: 'Läs reglerna' är en knapp */
#ff-vinnpop button.ff-ap-no { width: 100%; border: 0; background: none; font-family: inherit; cursor: pointer; }

/* =====================================================================
   WEBSHOP REDESIGN (Lela 2026-10-17) – skandinavisk lyx: ivory, svart, champagneguld.
   Tokens: bakgrund #F7EEE5 · kort #FFFFFF · svart #15120F · guld #DFC080
           text #211B17 · sekundär #81766D · ramar #EADBCD
   ===================================================================== */
body .fp.fp-shopmode { --ff-bg: #F7EEE5; --ff-card: #FFFFFF; --ff-ink: #15120F; --ff-gold: #DFC080; --ff-text: #211B17; --ff-muted: #81766D; --ff-line: #EADBCD; --ff-soft: #F9F3EC; --ff-r: 18px; }
body .fp.fp-shopmode { background: var(--ff-bg); color: var(--ff-text); }

/* ---- Produktkort ---- */
body .fp.fp-shopmode .fp-shop-grid { gap: 12px; }
body .fp.fp-shopmode .fp-shop-card { display: flex; flex-direction: column; background: var(--ff-card); border: 1px solid var(--ff-line); border-radius: var(--ff-r); box-shadow: 0 1px 2px rgba(33, 27, 23, .04); padding: 8px 8px 10px; overflow: hidden; }
body .fp.fp-shopmode .fp-shop-card:hover { box-shadow: 0 6px 18px rgba(33, 27, 23, .07); }
body .fp.fp-shopmode .fp-shop-img { position: relative; aspect-ratio: 1 / 1; border-radius: 13px; background: #F6F0E9; overflow: hidden; }
body .fp.fp-shopmode .fp-shop-img img { width: 100%; height: 100%; object-fit: cover; display: block; }
body .fp.fp-shopmode .fp-shop-title { font-family: var(--sans, "Inter", sans-serif); font-size: 14px; font-weight: 500; line-height: 1.32; color: var(--ff-text); margin: 10px 4px 3px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; min-height: 2.64em; }
body .fp.fp-shopmode .fp-shop-stars { display: flex; align-items: center; gap: 4px; margin: 0 4px; min-height: 16px; font-size: 11.5px; color: #C9A55C; }
body .fp.fp-shopmode .fp-shop-stars span { color: var(--ff-muted); }
body .fp.fp-shopmode .fp-shop-foot { margin-top: auto; display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 8px 4px 0; }
body .fp.fp-shopmode .fp-shop-price { display: flex; align-items: baseline; flex-wrap: wrap; gap: 0 6px; }
body .fp.fp-shopmode .fp-shop-price b { font-size: 16px; font-weight: 700; color: var(--ff-ink); letter-spacing: -.01em; }
body .fp.fp-shopmode .fp-shop-price s { font-size: 12px; color: var(--ff-muted); }
body .fp.fp-shopmode .fp-shop-buy { flex: none; width: 40px; height: 40px; border-radius: 12px; border: 0; background: var(--ff-gold) !important; color: var(--ff-ink) !important; display: grid; place-items: center; box-shadow: none; }
body .fp.fp-shopmode .fp-shop-buy svg { width: 19px; height: 19px; stroke: currentColor; }
body .fp.fp-shopmode .fp-shop-buy:disabled { background: #EFE7DD !important; color: var(--ff-muted) !important; }
body .fp.fp-shopmode .fp-shop-wish { position: absolute; top: 8px; right: 8px; width: 32px; height: 32px; border-radius: 50%; border: 0; background: rgba(255, 255, 255, .94); color: var(--ff-ink); display: grid; place-items: center; box-shadow: 0 1px 4px rgba(33, 27, 23, .08); }
body .fp.fp-shopmode .fp-shop-wish svg { width: 16px; height: 16px; }
body .fp.fp-shopmode .fp-shop-wish.is-on { color: #B8924F; }
body .fp.fp-shopmode .fp-shop-wish.is-on svg { fill: currentColor; }
body .fp.fp-shopmode .fp-shop-off { position: absolute; top: 8px; left: 8px; background: var(--ff-ink); color: var(--ff-gold); font-size: 11px; font-weight: 600; letter-spacing: .03em; padding: 4px 9px; border-radius: 999px; }
body .fp.fp-shopmode .fp-shop-out { position: absolute; left: 8px; bottom: 8px; background: rgba(255, 255, 255, .94); color: var(--ff-muted); font-size: 11px; font-weight: 600; padding: 4px 9px; border-radius: 999px; }
body .fp.fp-shopmode .fp-shop-sec-h h2 { font-family: "Playfair Display", Georgia, serif; font-weight: 500; font-size: 22px; color: var(--ff-ink); }

/* ---- Produktsidan ---- */
body .fp.fp-shopmode .fp-pd-info > .fp-card { background: var(--ff-card); border: 1px solid var(--ff-line); border-radius: 20px; box-shadow: none; padding: 18px 16px; }
body .fp.fp-shopmode .fp-shop-ptitle { font-family: "Playfair Display", Georgia, serif; font-weight: 500; font-size: 26px; line-height: 1.2; color: var(--ff-ink); margin: 0 0 6px; letter-spacing: -.005em; }
body .fp.fp-shopmode .fp-pd-info .fp-link { color: var(--ff-muted); }
body .fp.fp-shopmode .fp-shop-pprice { display: flex; align-items: center; flex-wrap: wrap; gap: 6px 10px; margin: 8px 0 2px; font-size: 24px; font-weight: 700; color: var(--ff-ink); }
body .fp.fp-shopmode .fp-shop-pprice s { font-size: 15px; font-weight: 500; color: var(--ff-muted); }
body .fp.fp-shopmode .fp-shop-sale-tag { background: var(--ff-ink); color: var(--ff-gold); font-size: 12px; font-weight: 600; letter-spacing: .02em; padding: 5px 12px; border-radius: 999px; }
body .fp.fp-shopmode .fp-pd-info .fp-eyebrow { color: var(--ff-text); font-size: 11.5px; font-weight: 600; letter-spacing: .14em; }
body .fp.fp-shopmode .fp-pd-info .fp-chips { gap: 8px; }
body .fp.fp-shopmode .fp-pd-info .fp-chips .fp-chip { min-width: 44px; height: 40px; padding: 0 13px; border-radius: 999px; border: 1px solid var(--ff-line); background: var(--ff-card); color: var(--ff-text); font-size: 14px; font-weight: 500; display: inline-flex; align-items: center; justify-content: center; }
body .fp.fp-shopmode .fp-pd-info .fp-chips .fp-chip.is-on { background: var(--ff-ink); border-color: var(--ff-ink); color: #FFFFFF; }
body .fp.fp-shopmode .fp-pd-qtyrow { display: flex; align-items: center; flex-wrap: wrap; gap: 10px 16px; margin: 18px 0 14px; }
body .fp.fp-shopmode .fp-pd-qtyrow .fp-shop-qty { margin: 0; height: 46px; border: 1px solid var(--ff-line); border-radius: 999px; background: var(--ff-card); }
body .fp.fp-shopmode .fp-stock { display: inline-flex; align-items: center; gap: 7px; margin: 0; font-size: 13px; font-weight: 500; color: var(--ff-muted); }
body .fp.fp-shopmode .fp-stock:not(:empty)::before { content: ''; width: 8px; height: 8px; border-radius: 50%; background: #4E9F6C; flex: none; }
body .fp.fp-shopmode .fp-stock.low::before { background: #D3A13E; }
body .fp.fp-shopmode .fp-stock.out::before { background: #C0574F; }
body .fp.fp-shopmode .fp-pd-buy { height: 54px; border-radius: 999px; border: 0; background: var(--ff-ink) !important; color: var(--ff-gold) !important; font-size: 14px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; box-shadow: none; }
body .fp.fp-shopmode .fp-pd-buy:disabled { opacity: .45; }
body .fp.fp-shopmode .fp-prod-extra { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 10px; }
body .fp.fp-shopmode .fp-prod-extra .fp-btn { height: 44px; margin: 0; border: 1px solid var(--ff-line); border-radius: 999px; background: var(--ff-card); color: var(--ff-text); font-size: 11.5px; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; display: inline-flex; align-items: center; justify-content: center; gap: 7px; white-space: nowrap; }
body .fp.fp-shopmode .fp-prod-extra .fp-btn.is-on { border-color: #C9A55C; color: #8C6C33; }
body .fp.fp-shopmode .fp-prod-extra .fp-btn svg { width: 16px; height: 16px; }
body .fp.fp-shopmode .fp-pd-info .fp-prod-share { margin: 10px 0 0 !important; height: 44px; padding: 0 16px; border: 1px solid var(--ff-ink) !important; border-radius: 999px; background: var(--ff-card) !important; color: var(--ff-ink) !important; font-size: 11.5px; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; display: flex !important; align-items: center; justify-content: center; gap: 8px; }
body .fp.fp-shopmode .fp-pd-info .fp-prod-share svg { width: 17px; height: 17px; color: #B8924F; }

/* ---- Utfällbara sektioner ---- */
body .fp.fp-shopmode .fp-pd-info .fp-acc { margin-top: 12px; background: var(--ff-card); border: 1px solid var(--ff-line); border-radius: 20px; overflow: hidden; }
body .fp.fp-shopmode .fp-pd-info .fp-acc:empty { display: none; }
body .fp.fp-shopmode .fp-pd-info .fp-acc-item { border: 0; border-top: 1px solid #F0E5DA; border-radius: 0; margin: 0; background: transparent; }
body .fp.fp-shopmode .fp-pd-info .fp-acc-item:first-child { border-top: 0; }
body .fp.fp-shopmode .fp-pd-info .fp-acc-item > summary { list-style: none; display: flex; align-items: center; gap: 12px; padding: 15px 16px; font-size: 15px; font-weight: 600; color: var(--ff-text); cursor: pointer; }
body .fp.fp-shopmode .fp-pd-info .fp-acc-item > summary::-webkit-details-marker { display: none; }
body .fp.fp-shopmode .fp-pd-info .fp-acc-item > summary::after { content: ''; margin-left: auto; width: 7px; height: 7px; border-right: 1.6px solid var(--ff-muted); border-bottom: 1.6px solid var(--ff-muted); transform: rotate(45deg) translateY(-2px); transition: transform .18s ease; flex: none; }
body .fp.fp-shopmode .fp-pd-info .fp-acc-item[open] > summary::after { transform: rotate(-135deg) translateY(-1px); }
body .fp.fp-shopmode .fp-acc-ico { width: 22px; height: 22px; flex: none; color: var(--ff-text); display: grid; place-items: center; }
body .fp.fp-shopmode .fp-acc-ico svg { width: 21px; height: 21px; }
body .fp.fp-shopmode .fp-pd-info .fp-acc-item > :not(summary) { padding: 0 16px 16px; font-size: 14px; line-height: 1.55; color: #4A3F37; }
body .fp.fp-shopmode .fp-pd-info .fp-acc-item .fp-facts ul { list-style: none; margin: 0; padding: 12px 14px; background: var(--ff-soft); border-radius: 14px; }
body .fp.fp-shopmode .fp-pd-info .fp-acc-item .fp-facts li { padding: 4px 0; font-size: 14px; color: var(--ff-text); }
body .fp.fp-shopmode .fp-pd-info .fp-acc-item .fp-facts b { font-weight: 600; }

/* ---- Passar perfekt med ---- */
body .fp.fp-shopmode .fp-recs { margin-top: 8px; }
@media (max-width: 700px) {
  body .fp.fp-shopmode .fp-recs .fp-shop-grid { display: grid; grid-auto-flow: column; grid-auto-columns: 46%; grid-template-columns: none; overflow-x: auto; scroll-snap-type: x mandatory; padding-bottom: 6px; scrollbar-width: none; }
  body .fp.fp-shopmode .fp-recs .fp-shop-grid::-webkit-scrollbar { display: none; }
  body .fp.fp-shopmode .fp-recs .fp-shop-card { scroll-snap-align: start; }
}

/* ---- Bottennavigation (mobil) ---- */
@media (max-width: 1023px) {
  body .fp .fp-nav { background: #15120F !important; border-top: 1px solid rgba(223, 192, 128, .22); }
  body .fp .fp-nav-in > button { gap: 5px; color: rgba(223, 192, 128, .55); font-size: 10.5px; font-weight: 500; letter-spacing: .02em; }
  body .fp .fp-nav-in > button svg, body .fp .fp-nav-in > button .fp-ico { width: 22px; height: 22px; stroke-width: 1.6; }
  body .fp .fp-nav-in > button.is-on { color: #DFC080; font-weight: 600; }
  body .fp .fp-nav-in > button.is-on::before { content: ''; position: absolute; top: 5px; left: 50%; width: 18px; height: 2px; margin-left: -9px; border-radius: 2px; background: #DFC080; }
  body .fp .fp-nav .fp-nav-plus::before { display: none; }
  body .fp .fp-nav .fp-plus-ring { width: 44px !important; height: 44px !important; background: #DFC080 !important; color: #15120F !important; box-shadow: 0 0 0 4px #15120F, 0 4px 12px rgba(223, 192, 128, .25) !important; }
  body .fp .fp-nav .fp-plus-ring svg { stroke: #15120F !important; width: 22px; height: 22px; }
}

/* Produktkort: ingen tom rad där betyg saknas – priset hamnar ändå längst ned på alla kort. */
body .fp.fp-shopmode .fp-shop-stars.fp-shop-stars-empty { min-height: 0; margin: 0; }
body .fp.fp-shopmode .fp-shop-title { min-height: 0; }

/* Taggade produkter i kommentarer ("=Namn") */
.fp .fp-cm-prods { display: grid; gap: 6px; margin: 6px 0 2px; max-width: 380px; }
.fp .fp-cm-prods .fp-product { margin: 0; }
.fp .fp-cm-mentions { margin: 0 12px 6px; }

/* ==== Toppen i appen (Lela 2026-10-17): headern stannar under klockan när man skrollar,
   och fältet ovanför FINAFRANSAR är svart ==== */
.fp .fp-top, .fp-standalone .fp .fp-top { top: env(safe-area-inset-top, 0px); }
.fp .fp-tabs, .fp .fp-dm-head, .fp .fp-shop-head { top: calc(56px + env(safe-area-inset-top, 0px)); }
.fp:has(.fp-top-lux) .fp-tabs, .fp:has(.fp-top-lux) .fp-dm-head, .fp:has(.fp-top-lux) .fp-shop-head { top: calc(54px + env(safe-area-inset-top, 0px)); }
.fp::before { content: ''; position: fixed; z-index: 60; left: 0; right: 0; top: 0; height: env(safe-area-inset-top, 0px); background: #12100D; pointer-events: none; }