
  /* Neutralisera page.mustache-chromet (auto-H1, max-w-4xl, py-16, brödsmulor) — samma grepp som varukorg.html */
  body:has(#bp-egna) section[data-qb-setting="show_breadcrumbs"] { display: none; }
  section:has(#bp-egna) { padding-top: 0 !important; padding-bottom: 0 !important; }
  section:has(#bp-egna) .container { max-width: none !important; padding: 0 !important; }
  section:has(#bp-egna) .max-w-4xl { max-width: none !important; }
  section:has(#bp-egna) h1.text-h1:not(.eg-seo-h1) { display: none; }

  @keyframes egStampIn { 0% { transform: skewX(-3deg) scale(2.4); opacity: 0; } 55% { transform: skewX(-3deg) scale(0.95); opacity: 1; } 78% { transform: skewX(-3deg) scale(1.04); } 100% { transform: skewX(-3deg) scale(1); } }
  @keyframes egFloat { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-7px); } }
  @keyframes egSlide { 0% { transform: translateX(115%); opacity: 0; } 2.6%, 14% { transform: translateX(0); opacity: 1; } 16.6%, 100% { transform: translateX(-115%); opacity: 0; } }
  @keyframes egDot { 0%, 16.6% { background: #FF3DB4; } 16.61%, 100% { background: rgba(255,255,255,0.22); } }
  @keyframes egSheen { 0%, 2.8% { background-position: 140% 0; } 7.5% { background-position: -40% 0; } 7.51%, 100% { background-position: 140% 0; } }
  @keyframes egSway { 0% { transform: translateY(0); } 100% { transform: translateY(-8px); } }
  @keyframes egRefract { 0% { filter: hue-rotate(0deg); opacity: 0.5; } 50% { opacity: 0.75; } 100% { filter: hue-rotate(360deg); opacity: 0.5; } }
  @keyframes egHolo { 0%, 58% { background-position: -170% 0; } 90%, 100% { background-position: 270% 0; } }
  @keyframes egSpin { to { transform: rotate(360deg); } }

  /* line-height: normal — prototypen har ingen reset (Tailwinds html{line-height:1.5} gav 3 px högre rader) */
  #bp-egna { color: #F2F3F7; font-family: 'Geist', 'Geist-fallback', sans-serif; overflow-x: hidden; line-height: normal; }
  /* Boxmodell EXAKT som prototypen: content-box överallt (1280 px innehåll + 36 px padding, 620 px hög
     ruta + 3 px ram) utom de 13 element som facit själv sätter border-box på. Temats Tailwind-reset
     (border-box på allt) gjorde annars hela sidan 6 % smalare än facit. */
  #bp-egna, #bp-egna * { box-sizing: content-box; }
  #bp-egna .eg-egen, #bp-egna .eg-val-img, #bp-egna .eg-wrap-img, #bp-egna .eg-slabtile img, #bp-egna .eg-blirt img,
  #bp-egna .eg-kortb-tom, #bp-egna .eg-pv-l, #bp-egna .eg-fa { box-sizing: border-box; }
  /* Heron och stegen i butikens bredd (Dan 2026-09-24: "är den inte bredare än vår sida?"): 1280 px
     INKLUSIVE 36 px luft, alltså 1208 px innehåll som header, USP-rad och footer (116–1324 px vid 1440).
     Prototypens 1280 px innehåll gjorde sidan 36 px bredare per sida än resten av butiken live. */
  #bp-egna .eg-hero-in, #bp-egna .eg-steg { box-sizing: border-box; }
  /* Prototypens <button> bär webbläsarens standard border-box: fotoknapparna är 56×74 inklusive ram,
     även valda med 3 px ram. Med content-box blev de 58×76 och 62×80 när ett foto valdes. */
  #bp-egna button { box-sizing: border-box; }
  #bp-egna a { color: inherit; text-decoration: none; }
  #bp-egna p { margin: 0; max-width: none; }
  #bp-egna h1, #bp-egna h2 { margin: 0; color: #F2F3F7; }
  #bp-egna img { max-width: none; }
  #bp-egna .eg-anton { font-family: 'Anton', 'Anton-fallback', sans-serif; font-weight: 400; }
  #bp-egna .eg-marker { font-family: 'Permanent Marker', 'PM-fallback', cursive; color: #B7FF2E; transform: rotate(-2.5deg); text-shadow: 2px 2px 0 rgba(0,0,0,0.8); align-self: flex-start; }
  #bp-egna .eg-acc { color: #FF3DB4; }
  #bp-egna .eg-hidden { display: none !important; }
  #bp-egna .eg-nobr { white-space: nowrap; }

  /* Priser: Anton, versaler, vit text på mörk platta, skewX(-4deg) (PROMPT.md) */
  #bp-egna .eg-plate { font-size: 12px; padding: 3px 9px 2px; white-space: nowrap; font-family: 'Anton', 'Anton-fallback', sans-serif; letter-spacing: 0.04em; color: #FFFFFF; background: rgba(6,7,9,0.7); transform: skewX(-4deg); display: inline-block; }

  /* Knappar (SPEC §2) */
  #bp-egna .eg-btn { font-family: 'Anton', 'Anton-fallback', sans-serif; letter-spacing: 0.05em; text-transform: uppercase; transform: skewX(-6deg); display: inline-block; cursor: pointer; border: 0; }
  #bp-egna .eg-btn > span { display: inline-block; transform: skewX(6deg); }
  #bp-egna .eg-btn-p { background: #FF3DB4; color: #08090B; font-size: 17px; padding: 15px 32px 13px; box-shadow: 4px 5px 0 rgba(0,0,0,0.7); }
  #bp-egna .eg-btn-p:hover { background: #FFFFFF; color: #08090B; transform: skewX(-6deg) translate(-2px, -2px); box-shadow: 7px 8px 0 rgba(0,0,0,0.7); }
  #bp-egna .eg-btn-s { border: 2px solid rgba(255,255,255,0.35); color: #F2F3F7; font-size: 15px; padding: 14px 26px 12px; background: transparent; }
  #bp-egna .eg-btn-s:hover { border-color: #FFFFFF; color: #FFFFFF; transform: skewX(-6deg) translate(-2px, -2px); box-shadow: 4px 5px 0 rgba(0,0,0,0.7); }

  /* Rubriker med pink slab */
  #bp-egna .eg-num { font-family: 'Anton', 'Anton-fallback', sans-serif; font-size: 68px; line-height: 1; color: #FF3DB4; transform: skewX(-5deg); text-shadow: 4px 4px 0 rgba(0,0,0,0.6); }
  #bp-egna .eg-h2 { font-family: 'Anton', 'Anton-fallback', sans-serif; font-weight: 400; font-size: clamp(28px, 3vw, 40px); letter-spacing: 0.02em; line-height: 1.02; text-transform: uppercase; transform: skewX(-3deg); }
  #bp-egna .eg-p { font-size: 15px; line-height: 1.65; color: #C4C7D4; max-width: 46ch; }
  #bp-egna .eg-kol { display: flex; flex-direction: column; gap: 12px; }
  #bp-egna .eg-rub { font-family: 'Anton', 'Anton-fallback', sans-serif; font-size: 16px; letter-spacing: 0.05em; text-transform: uppercase; color: #FFFFFF; transform: skewX(-3deg); display: inline-flex; align-items: center; gap: 9px; }
  #bp-egna .eg-rub::before { content: ''; width: 9px; height: 17px; background: #FF3DB4; transform: skewX(-10deg); display: inline-block; flex-shrink: 0; }

  /* ── Hero ── */
  #bp-egna .eg-hero { position: relative; overflow: hidden; border-bottom: 1px solid rgba(255,255,255,0.07); }
  #bp-egna .eg-hero-in { max-width: 1280px; margin: 0 auto; padding: 54px 36px 18px; position: relative; display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); gap: 48px; align-items: center; }
  /* Texten centreras mot scenens bildyta (de översta 524 px), inte mot hela lådan på 620 px där
     de nedersta 96 px bara är spegling och prickar: margin-bottom 96 px lyfter mitten 48 px
     (Dan 2026-09-23: "mitt på slidern vertikalt"). Avvikelse från facit. */
  #bp-egna .eg-hero-txt { display: flex; flex-direction: column; gap: 16px; margin-bottom: 96px; }
  /* H1:an bär sökfrasen "Egna fotbollskort" och står som en vit rad UNDER sloganen (Dan 2026-09-24 kväll:
     inte en grå sökordsrad ovanför rubriken, samma grepp som startsidans förslag). Sloganen är en div med
     oförändrat utseende — allt sitter på klassen .eg-h1. QB:s tailwind-styling lägger
     font-heading/text-h1/mt-8/mb-4 på varje h1; reglerna här vinner på specificitet. */
  #bp-egna .eg-seo-h1 { margin: -2px 0 0; font-family: 'Geist', 'Geist-fallback', sans-serif; font-size: 18px; font-weight: 600; letter-spacing: 0; line-height: 1.4; text-transform: none !important; transform: none; color: #F2F3F7; max-width: 34ch; text-wrap: balance; }
  /* KOMMER SNART-brickan (variant A, Dan 2026-09-25): sidans egen etikettform — samma som .eg-slab-lab,
     i cyan, skev, utan rundade hörn ("inte rundade hörn på kommer snart. följ vårt designspråk"). */
  #bp-egna .eg-tag { align-self: flex-start; font-family: 'Anton', 'Anton-fallback', sans-serif; font-size: 14px; letter-spacing: 0.06em; line-height: 1.2; text-transform: uppercase; color: #08090B; background: #40E0FF; padding: 6px 12px 4px; transform: skewX(-4deg); border-radius: 0; }
  /* Leveransraden bor i föranmälan sedan 2026-09-25 (variant A tog den ur heron). */
  #bp-egna .eg-fa-not { margin: 0; font-size: 13px; font-weight: 500; color: #9CA0AE; }
  #bp-egna .eg-h1wrap { position: relative; align-self: flex-start; }
  /* Radavstånd 1,1, inte facits 0,96 (2026-09-25): Antons Ä-prickar ritas över versalhöjden och lade
     sig med 0,96 som en rosa klick i nederkanten av "DINA" — i dator och mobil. 1,04 räckte inte
     (prickarna nuddade fortfarande D:et i 3x-förstoring); 1,1 ger luft vid alla bredder. */
  #bp-egna .eg-h1 { font-family: 'Anton', 'Anton-fallback', sans-serif; font-weight: 400; font-size: clamp(46px, 5.2vw, 76px); letter-spacing: 0.015em; line-height: 1.1; text-transform: uppercase; transform: skewX(-3deg); animation: egStampIn 0.55s cubic-bezier(0.34, 1.4, 0.44, 1) both; text-align: left; }
  #bp-egna .eg-ingress { font-size: 16px; line-height: 1.65; color: #C4C7D4; max-width: 50ch; }
  #bp-egna .eg-cta { display: flex; gap: 14px; align-items: center; flex-wrap: wrap; margin-top: 4px; }
  #bp-egna .eg-scen { position: relative; height: 620px; perspective: 1100px; animation: egFloat 7s ease-in-out infinite; }
  #bp-egna .eg-glow { position: absolute; left: 50%; top: 44%; transform: translate(-50%, -50%); width: 640px; height: 430px; background: radial-gradient(ellipse, rgba(255,61,180,0.22) 0%, rgba(124,92,255,0.14) 48%, transparent 74%); filter: blur(46px); pointer-events: none; }
  #bp-egna .eg-slide { position: absolute; inset: 0; pointer-events: none; animation: egSlide 30s cubic-bezier(0.22, 1, 0.36, 1) infinite; will-change: transform, opacity; }
  #bp-egna .eg-slide-in { position: absolute; left: 0; right: 0; top: 0; bottom: 96px; display: flex; align-items: flex-end; justify-content: center; }
  #bp-egna .eg-sway { display: flex; align-items: flex-end; justify-content: center; height: 100%; max-width: 100%; animation: egSway 4.5s ease-in-out infinite alternate; will-change: transform; }
  #bp-egna .eg-obj { position: relative; display: inline-flex; align-items: flex-end; justify-content: center; height: 100%; max-width: 100%; }
  #bp-egna .eg-oimg { max-height: 100%; max-width: 100%; width: auto; height: auto; display: block; }
  #bp-egna .eg-oimg.eg-skugga { filter: drop-shadow(0 26px 44px rgba(0,0,0,0.6)); }
  /* Speglingen: riktigt element (box-reflect renderar inte överallt), 6 px glapp, tonar ut på 40 % */
  #bp-egna .eg-refl { position: absolute; left: 0; top: calc(100% + 6px); width: 100%; height: 100%; object-fit: contain; object-position: center bottom; transform: scaleY(-1); pointer-events: none; -webkit-mask-image: linear-gradient(to top, rgba(0,0,0,0.18), transparent 40%); mask-image: linear-gradient(to top, rgba(0,0,0,0.18), transparent 40%); }
  #bp-egna .eg-sheen { position: absolute; inset: 0; background: linear-gradient(115deg, transparent 38%, rgba(255,255,255,0.6) 50%, transparent 62%); background-size: 300% 100%; background-repeat: no-repeat; -webkit-mask-size: contain; mask-size: contain; -webkit-mask-position: center bottom; mask-position: center bottom; -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat; animation: egSheen 30s linear infinite; pointer-events: none; }
  #bp-egna .eg-s1, #bp-egna .eg-s1 .eg-sheen { animation-delay: 0s; }
  #bp-egna .eg-s2, #bp-egna .eg-s2 .eg-sheen { animation-delay: -25s; }
  #bp-egna .eg-s3, #bp-egna .eg-s3 .eg-sheen { animation-delay: -20s; }
  #bp-egna .eg-s4, #bp-egna .eg-s4 .eg-sheen { animation-delay: -15s; }
  #bp-egna .eg-s5, #bp-egna .eg-s5 .eg-sheen { animation-delay: -10s; }
  #bp-egna .eg-s6, #bp-egna .eg-s6 .eg-sheen { animation-delay: -5s; }
  #bp-egna .eg-s1 .eg-sheen { -webkit-mask-image: url('https://cdn.quickbutik.com/images/99246J/products/6ab3b7ef00251.png?auto=format&w=1200'); mask-image: url('https://cdn.quickbutik.com/images/99246J/products/6ab3b7ef00251.png?auto=format&w=1200'); }
  #bp-egna .eg-s2 .eg-sheen { -webkit-mask-image: url('https://cdn.quickbutik.com/images/99246J/products/6ab4ebd511aa7.png?auto=format&w=1200'); mask-image: url('https://cdn.quickbutik.com/images/99246J/products/6ab4ebd511aa7.png?auto=format&w=1200'); }
  #bp-egna .eg-s3 .eg-sheen { -webkit-mask-image: url('https://cdn.quickbutik.com/images/99246J/products/6ab597f2e18ab.png?auto=format&w=1200'); mask-image: url('https://cdn.quickbutik.com/images/99246J/products/6ab597f2e18ab.png?auto=format&w=1200'); }
  #bp-egna .eg-s4 .eg-sheen { -webkit-mask-image: url('https://cdn.quickbutik.com/images/99246J/products/6ab4fdc8207b2.png?auto=format&w=1200'); mask-image: url('https://cdn.quickbutik.com/images/99246J/products/6ab4fdc8207b2.png?auto=format&w=1200'); }
  #bp-egna .eg-s5 .eg-sheen { -webkit-mask-image: url('https://cdn.quickbutik.com/images/99246J/products/6ab3b819b5d24.png?auto=format&w=1200'); mask-image: url('https://cdn.quickbutik.com/images/99246J/products/6ab3b819b5d24.png?auto=format&w=1200'); }
  #bp-egna .eg-s6 .eg-sheen { -webkit-mask-image: url('https://cdn.quickbutik.com/images/99246J/products/6ab3b81a98a4e.png?auto=format&w=1200'); mask-image: url('https://cdn.quickbutik.com/images/99246J/products/6ab3b81a98a4e.png?auto=format&w=1200'); }
  #bp-egna .eg-dots { position: absolute; left: 50%; bottom: 24px; transform: translateX(-50%); display: flex; gap: 10px; z-index: 3; }
  #bp-egna .eg-dots span { width: 9px; height: 9px; border-radius: 999px; background: rgba(255,255,255,0.22); animation: egDot 30s linear infinite; }
  #bp-egna .eg-dots span:nth-child(1) { animation-delay: 0s; }
  #bp-egna .eg-dots span:nth-child(2) { animation-delay: -25s; }
  #bp-egna .eg-dots span:nth-child(3) { animation-delay: -20s; }
  #bp-egna .eg-dots span:nth-child(4) { animation-delay: -15s; }
  #bp-egna .eg-dots span:nth-child(5) { animation-delay: -10s; }
  #bp-egna .eg-dots span:nth-child(6) { animation-delay: -5s; }

  /* ── Steg ── */
  #bp-egna .eg-steg { max-width: 1280px; margin: 0 auto; padding: 56px 36px 8px; display: flex; flex-direction: column; gap: 60px; }
  #bp-egna .eg-b01 { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr); gap: 44px; align-items: start; }
  #bp-egna .eg-b02 { display: grid; grid-template-columns: minmax(0, 1.7fr) minmax(0, 1fr); gap: 40px; align-items: center; }
  #bp-egna .eg-b03 { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr); gap: 44px; align-items: center; }
  #bp-egna .eg-b04 { display: grid; grid-template-columns: minmax(0, 1.7fr) minmax(0, 1fr); gap: 40px; align-items: center; }
  #bp-egna .eg-b05 { display: flex; flex-direction: column; gap: 26px; }
  #bp-egna .eg-b06 { display: flex; flex-direction: column; gap: 20px; }
  #bp-egna .eg-btek { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr); gap: 44px; align-items: center; margin-top: 16px; }

  /* 01 Tema */
  #bp-egna .eg-b01-r { display: flex; flex-direction: column; gap: 10px; min-width: 0; }
  #bp-egna .eg-temagrid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
  #bp-egna .eg-tema { position: relative; aspect-ratio: 5 / 7; border-radius: 14px; overflow: hidden; border: 1px solid rgba(255,255,255,0.14); min-width: 0; }
  #bp-egna .eg-tema.eg-on { border: 3px solid #FF3DB4; }
  #bp-egna .eg-tema img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
  #bp-egna .eg-tema-grad { position: absolute; inset: 0; background: linear-gradient(180deg, transparent 62%, rgba(6,7,9,0.92) 94%); }
  #bp-egna .eg-tema-lab { position: absolute; left: 11px; bottom: 9px; font-family: 'Anton', 'Anton-fallback', sans-serif; font-size: 16px; transform: skewX(-4deg); pointer-events: none; }
  #bp-egna .eg-stick { position: absolute; top: 8px; right: 8px; font-family: 'Permanent Marker', 'PM-fallback', cursive; font-size: 13px; color: #B7FF2E; background: rgba(6,7,9,0.78); border-radius: 999px; padding: 3px 10px; transform: rotate(3deg); pointer-events: none; white-space: nowrap; }
  #bp-egna .eg-check { position: absolute; right: 8px; top: 8px; width: 22px; height: 22px; border-radius: 50%; background: #FF3DB4; color: #08090B; font-size: 12px; font-weight: 800; display: none; align-items: center; justify-content: center; }
  #bp-egna .eg-tema.eg-on .eg-check { display: flex; }
  #bp-egna .eg-egen { aspect-ratio: 5 / 7; border-radius: 14px; background: linear-gradient(180deg, #14161C, #0B0D11); border: 1px solid rgba(255,255,255,0.14); display: flex; flex-direction: column; justify-content: flex-end; padding: 12px; gap: 4px; min-width: 0; overflow: hidden; }
  #bp-egna .eg-egen-std { align-self: flex-start; font-size: 8px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; color: #9CA0AE; border: 1px solid rgba(255,255,255,0.2); border-radius: 999px; padding: 2px 7px; }
  #bp-egna .eg-egen-t { font-family: 'Anton', 'Anton-fallback', sans-serif; font-size: 16px; color: #FFFFFF; transform: skewX(-4deg); }
  #bp-egna .eg-egen-d { display: inline-flex; align-items: flex-start; gap: 5px; font-size: 11.5px; line-height: 1.45; color: #9CA0AE; }
  #bp-egna .eg-egen-d svg { flex-shrink: 0; margin-top: 1px; }
  #bp-egna .eg-fler { font-size: 12px; color: #6F7380; }
  /* Sju teman och Egen design syns från början, resten bakom knappen (Dan 2026-09-24: "teman du ska
     visa 7st ... sen ska du visa alla teman med en knapp"). Knappen i demopanelens sekundärstil (.eg-nytt). */
  #bp-egna .eg-temagrid.eg-hopfalld .eg-tema-extra { display: none; }
  #bp-egna .eg-tema-fot { display: flex; align-items: center; flex-wrap: wrap; gap: 10px 16px; margin-top: 4px; }
  #bp-egna .eg-alla { font-family: 'Anton', 'Anton-fallback', sans-serif; font-size: 13px; letter-spacing: 0.05em; text-transform: uppercase; color: #C4C7D4; border: 1px solid rgba(255,255,255,0.2); padding: 8px 16px 6px; transform: skewX(-6deg); display: inline-block; cursor: pointer; background: transparent; }
  #bp-egna .eg-alla > span { display: inline-block; transform: skewX(6deg); }
  #bp-egna .eg-alla:hover, #bp-egna .eg-alla:focus-visible { color: #F2F3F7; border-color: #FF3DB4; }

  /* 02 Pack eller slab */
  #bp-egna .eg-valgrid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
  #bp-egna .eg-val { position: relative; min-width: 0; cursor: pointer; border: 3px solid rgba(255,255,255,0.12); border-radius: 18px; overflow: hidden; height: 620px; background: #050608; }
  #bp-egna .eg-val.eg-on { border-color: #FF3DB4; }
  #bp-egna .eg-val-img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; }
  #bp-egna .eg-val-pack .eg-val-img { padding: 0 0 52px; }
  #bp-egna .eg-val-slab .eg-val-img { padding: 34px 0 76px; }
  #bp-egna .eg-val-grad { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(6,7,9,0.25) 0%, transparent 30%, transparent 52%, rgba(5,6,8,0.96) 92%); }
  #bp-egna .eg-val-stick { position: absolute; top: 12px; right: 14px; font-family: 'Permanent Marker', 'PM-fallback', cursive; font-size: 14px; color: #B7FF2E; transform: rotate(3deg); text-shadow: 1px 1px 0 rgba(0,0,0,0.8); white-space: nowrap; }
  #bp-egna .eg-valt { position: absolute; top: 12px; left: 14px; font-size: 11px; font-weight: 800; letter-spacing: 0.1em; color: #08090B; background: #FF3DB4; border-radius: 999px; padding: 5px 12px; display: none; }
  #bp-egna .eg-val.eg-on .eg-valt { display: inline-block; }
  #bp-egna .eg-val-bot { position: absolute; left: 20px; right: 20px; bottom: 18px; display: flex; flex-direction: column; gap: 6px; }
  #bp-egna .eg-val-rad { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; }
  #bp-egna .eg-val-n { font-family: 'Anton', 'Anton-fallback', sans-serif; font-size: 30px; letter-spacing: 0.03em; color: #FFFFFF; transform: skewX(-4deg); text-shadow: 0 3px 10px rgba(0,0,0,0.8); }
  #bp-egna .eg-val-p { font-size: 16px; padding: 6px 12px 4px; font-family: 'Anton', 'Anton-fallback', sans-serif; letter-spacing: 0.04em; color: #FFFFFF; background: rgba(6,7,9,0.7); transform: skewX(-4deg); display: inline-block; }
  #bp-egna .eg-val-d { font-size: 12.5px; line-height: 1.5; color: #C4C7D4; }

  /* 03 Antal & wrapper */
  #bp-egna .eg-b03-r { display: flex; flex-direction: column; gap: 14px; }
  #bp-egna[data-mode="pack"] .eg-om-slab, #bp-egna[data-mode="slab"] .eg-om-pack { display: none; }
  #bp-egna .eg-om-pack, #bp-egna .eg-om-slab { display: flex; flex-direction: column; gap: 14px; }
  #bp-egna .eg-antalgrid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
  #bp-egna .eg-antal { position: relative; border: 1px solid rgba(255,255,255,0.10); border-radius: 12px; background: rgba(255,255,255,0.03); padding: 12px 8px 10px; display: flex; flex-direction: column; align-items: center; gap: 2px; }
  #bp-egna .eg-antal.eg-on { border: 3px solid #FF3DB4; background: rgba(255,61,180,0.08); }
  #bp-egna .eg-antal-n { font-family: 'Anton', 'Anton-fallback', sans-serif; font-size: 24px; transform: skewX(-5deg); }
  #bp-egna .eg-antal.eg-on .eg-antal-n { color: #FF3DB4; }
  #bp-egna .eg-antal-stick { position: absolute; top: -11px; left: 50%; transform: translateX(-50%) rotate(-2deg); font-family: 'Permanent Marker', 'PM-fallback', cursive; font-size: 12px; color: #B7FF2E; text-shadow: 1px 1px 0 rgba(0,0,0,0.8); white-space: nowrap; }
  #bp-egna .eg-antal-u { font-size: 10.5px; color: #6F7380; }
  #bp-egna .eg-antal .eg-plate { margin-top: 2px; }
  #bp-egna .eg-wrapgrid { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
  #bp-egna .eg-wrap { position: relative; height: 470px; border-radius: 16px; overflow: hidden; border: 1px solid rgba(255,255,255,0.10); background: #050608; }
  #bp-egna .eg-wrap.eg-on { border: 3px solid #FF3DB4; }
  #bp-egna .eg-wrap-silver:hover { border-color: rgba(255,255,255,0.3); }
  #bp-egna .eg-wrap-eget:hover { border-color: #FF3DB4; }
  #bp-egna .eg-wrap-img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; padding: 26px 26px 58px; }
  #bp-egna .eg-wrap-p { position: absolute; right: 12px; bottom: 12px; z-index: 2; font-family: 'Anton', 'Anton-fallback', sans-serif; font-size: 14px; letter-spacing: 0.04em; color: #FFFFFF; background: rgba(6,7,9,0.7); padding: 6px 12px 4px; transform: skewX(-4deg); }
  #bp-egna .eg-wrap-lab { position: absolute; left: 12px; bottom: 12px; z-index: 2; font-family: 'Anton', 'Anton-fallback', sans-serif; font-size: 14px; letter-spacing: 0.06em; color: #FFFFFF; background: rgba(6,7,9,0.7); padding: 6px 12px 4px; transform: skewX(-4deg); pointer-events: none; }
  #bp-egna .eg-wrap.eg-on .eg-wrap-lab { color: #08090B; background: #FF3DB4; }
  #bp-egna .eg-slabtile { position: relative; height: 470px; border-radius: 16px; overflow: hidden; border: 1.5px solid rgba(255,61,180,0.45); background: #050608; }
  #bp-egna .eg-slabtile img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; padding: 14px 14px 60px; }
  #bp-egna .eg-slab-lab { position: absolute; left: 12px; bottom: 12px; z-index: 2; font-family: 'Anton', 'Anton-fallback', sans-serif; font-size: 14px; letter-spacing: 0.06em; color: #08090B; background: #FF3DB4; padding: 6px 12px 4px; transform: skewX(-4deg); }

  /* 04 Ladda upp */
  #bp-egna .eg-upp { border: 1px solid rgba(255,255,255,0.10); border-radius: 18px; background: rgba(255,255,255,0.025); padding: 24px; display: flex; flex-direction: column; gap: 14px; }
  #bp-egna .eg-upp-h { display: flex; align-items: center; justify-content: space-between; }
  #bp-egna .eg-upp-t { font-size: 13px; font-weight: 700; }
  #bp-egna .eg-upp-c { font-size: 12px; color: #6F7380; }
  #bp-egna .eg-drop { position: relative; border: 2px dashed rgba(255,61,180,0.55); border-radius: 14px; background: rgba(255,61,180,0.05); padding: 34px 20px 30px; display: flex; flex-direction: column; align-items: center; gap: 7px; text-align: center; }
  #bp-egna .eg-drop-t { font-family: 'Anton', 'Anton-fallback', sans-serif; font-size: 21px; letter-spacing: 0.04em; color: #FFFFFF; transform: skewX(-3deg); display: inline-block; }
  #bp-egna .eg-drop-s { font-size: 13.5px; color: #9CA0AE; }
  #bp-egna .eg-drop-s span { color: #FF3DB4; font-weight: 600; text-decoration: underline; }
  #bp-egna .eg-slots { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 8px; }
  #bp-egna .eg-slot { position: relative; aspect-ratio: 5 / 7; border-radius: 8px; overflow: hidden; border: 1.5px dashed rgba(255,255,255,0.18); background: rgba(255,255,255,0.02); }
  #bp-egna .eg-slot[data-st="1"] { border: 3px solid #FF3DB4; }
  #bp-egna .eg-slot[data-st="2"] { border: 1px solid rgba(255,255,255,0.18); }
  #bp-egna .eg-slot-img { position: absolute; inset: 0; background-size: cover; background-position: center; display: none; }
  #bp-egna .eg-slot[data-st="1"] .eg-slot-img { display: block; opacity: 0.28; }
  #bp-egna .eg-slot[data-st="2"] .eg-slot-img { display: block; }
  #bp-egna .eg-slot-ok { position: absolute; right: 4px; top: 4px; width: 16px; height: 16px; border-radius: 50%; background: #4ADE80; color: #08090B; font-size: 10px; font-weight: 800; display: none; align-items: center; justify-content: center; }
  #bp-egna .eg-slot-del { position: absolute; right: 4px; bottom: 4px; width: 18px; height: 18px; border-radius: 5px; background: rgba(6,7,9,0.75); display: none; align-items: center; justify-content: center; cursor: pointer; }
  #bp-egna .eg-slot[data-st="2"] .eg-slot-ok, #bp-egna .eg-slot[data-st="2"] .eg-slot-del { display: flex; }
  #bp-egna .eg-slot-spin { position: absolute; left: 50%; top: 50%; margin: -11px 0 0 -11px; width: 22px; height: 22px; border-radius: 50%; border: 2.5px solid rgba(255,255,255,0.25); border-top-color: #FF3DB4; animation: egSpin 0.8s linear infinite; display: none; }
  #bp-egna .eg-slot[data-st="1"] .eg-slot-spin { display: block; }
  #bp-egna .eg-slot-n { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; font-family: 'Anton', 'Anton-fallback', sans-serif; font-size: 15px; color: #4A5060; }
  #bp-egna .eg-slot[data-st="1"] .eg-slot-n, #bp-egna .eg-slot[data-st="2"] .eg-slot-n { display: none; }
  #bp-egna .eg-upp-note { font-size: 12px; color: #6F7380; line-height: 1.5; }
  #bp-egna .eg-info { border-left: 3px solid #40E0FF; padding-left: 14px; display: flex; flex-direction: column; gap: 3px; }
  #bp-egna .eg-info-t { font-size: 13px; font-weight: 700; }
  #bp-egna .eg-info-d { font-size: 13px; line-height: 1.6; color: #9CA0AE; }

  /* 05 Preview & justera */
  #bp-egna .eg-pv { border: 1px solid rgba(255,255,255,0.10); border-radius: 18px; background: rgba(255,255,255,0.025); padding: 26px; display: flex; flex-direction: column; gap: 24px; }
  #bp-egna .eg-pv-top { display: flex; flex-direction: column; gap: 12px; }
  #bp-egna .eg-kort { position: relative; display: flex; gap: 10px; flex-wrap: wrap; }
  #bp-egna .eg-kortb { display: inline-flex; align-items: center; gap: 8px; background: rgba(255,255,255,0.04); border: 1px solid rgba(255,255,255,0.16); border-radius: 12px; padding: 8px 17px 8px 8px; cursor: pointer; color: #F2F3F7; font-family: 'Geist', 'Geist-fallback', sans-serif; text-align: left; }
  #bp-egna .eg-kortb.eg-on { background: rgba(255,61,180,0.12); border: 3px solid #FF3DB4; }
  #bp-egna .eg-kortb-th { position: relative; width: 48px; height: 67px; border-radius: 6px; overflow: hidden; display: inline-block; flex-shrink: 0; background: #14161C; }
  #bp-egna .eg-kortb-img { position: absolute; inset: 0; background-size: cover; background-position: center; display: block; }
  #bp-egna .eg-kortb-tom { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; font-family: 'Anton', 'Anton-fallback', sans-serif; font-size: 17px; color: #4A5060; border: 1.5px dashed rgba(255,255,255,0.14); border-radius: 6px; }
  #bp-egna .eg-kortb.eg-skapad .eg-kortb-tom { display: none; }
  #bp-egna .eg-kortb-tx { display: inline-flex; flex-direction: column; align-items: flex-start; gap: 1px; }
  #bp-egna .eg-kortb-n { font-family: 'Anton', 'Anton-fallback', sans-serif; font-size: 13.5px; letter-spacing: 0.05em; color: #C4C7D4; }
  #bp-egna .eg-kortb.eg-on .eg-kortb-n { color: #FF3DB4; }
  #bp-egna .eg-kortb-t { font-size: 11.5px; color: #9CA0AE; }
  #bp-egna .eg-pv-main { display: flex; flex-wrap: wrap; gap: 26px; align-items: flex-start; }
  #bp-egna .eg-pv-l { width: 380px; max-width: 100%; display: flex; flex-direction: column; gap: 12px; flex-shrink: 0; }
  #bp-egna .eg-pv-float { position: relative; animation: egFloat 6.5s ease-in-out infinite; }
  #bp-egna .eg-pv-frame { position: relative; padding: 7px; border-radius: 16px; background: linear-gradient(155deg, #FDFDFF 0%, #9FB1C6 16%, #EDF2F8 30%, #3E4B60 48%, #F4F7FB 62%, #8FA3BA 80%, #EEF2F8 100%); box-shadow: 0 22px 44px rgba(0,0,0,0.6); transition: transform 0.5s ease; }
  #bp-egna .eg-pv-frame:hover { transform: perspective(900px) rotateY(-7deg) rotateX(3deg) scale(1.02); }
  #bp-egna .eg-pv-in { position: relative; background: #0A0B0F; overflow: hidden; border-radius: 10px; }
  #bp-egna .eg-pv-ref { position: absolute; inset: 0; z-index: 4; pointer-events: none; background: repeating-linear-gradient(112deg, rgba(255,61,180,0.14) 0px, rgba(255,211,77,0.12) 7px, rgba(183,255,46,0.12) 14px, rgba(64,224,255,0.14) 21px, rgba(124,92,255,0.14) 28px, rgba(255,61,180,0.14) 35px); mix-blend-mode: color-dodge; animation: egRefract 11s linear infinite; }
  #bp-egna .eg-pv-holo { position: absolute; inset: 0; z-index: 5; pointer-events: none; background: linear-gradient(115deg, transparent 36%, rgba(255,255,255,0.5) 50%, transparent 64%); background-size: 280% 100%; background-repeat: no-repeat; animation: egHolo 5s ease-in-out infinite; mix-blend-mode: screen; }
  #bp-egna .eg-pv-stage { position: relative; height: 520px; overflow: hidden; background: #101218; }
  #bp-egna .eg-pv-img { position: absolute; inset: 0; background-size: cover; background-position: center; display: block; }
  #bp-egna .eg-pv-tom { position: absolute; inset: 0; display: none; flex-direction: column; align-items: center; justify-content: center; gap: 10px; border: 2px dashed rgba(255,255,255,0.14); border-radius: 8px; margin: 14px; }
  #bp-egna .eg-pv-stage[data-fas="tom"] .eg-pv-tom { display: flex; }
  #bp-egna .eg-pv-tom-n { font-family: 'Anton', 'Anton-fallback', sans-serif; font-size: 44px; color: #2A2F3A; transform: skewX(-5deg); }
  #bp-egna .eg-pv-tom-t { font-size: 12.5px; font-weight: 600; color: #6F7380; }
  #bp-egna .eg-pv-foto { position: absolute; inset: 0; background: #101218; display: none; }
  #bp-egna .eg-pv-stage[data-fas="foto"] .eg-pv-foto { display: block; }
  #bp-egna .eg-pv-foto-img { position: absolute; inset: 20px 20px 44px; background-size: contain; background-position: center; background-repeat: no-repeat; display: block; }
  #bp-egna .eg-pv-foto-t { position: absolute; left: 0; right: 0; bottom: 14px; text-align: center; font-size: 12px; font-weight: 600; color: #9CA0AE; }
  #bp-egna .eg-pv-spin { position: absolute; inset: 0; background: rgba(8,9,11,0.88); display: none; flex-direction: column; align-items: center; justify-content: center; gap: 12px; }
  #bp-egna .eg-pv-stage[data-fas="spin"] .eg-pv-spin { display: flex; }
  #bp-egna .eg-spinner { width: 34px; height: 34px; border-radius: 50%; border: 3px solid rgba(255,255,255,0.2); border-top-color: #FF3DB4; animation: egSpin 0.8s linear infinite; display: block; }
  #bp-egna .eg-pv-spin-t { font-size: 12.5px; font-weight: 600; color: #C4C7D4; }
  #bp-egna .eg-bak { position: relative; aspect-ratio: 63.5 / 88.9; border-radius: 14px; background: #08090B; border: 1px solid rgba(255,255,255,0.12); overflow: hidden; }
  #bp-egna .eg-bak-ram { position: absolute; inset: 12px; border: 1px solid rgba(255,255,255,0.18); border-radius: 8px; overflow: hidden; display: block; }
  #bp-egna .eg-bak-m { position: absolute; inset: 0; background-image: url("data:image/svg+xml,%3Csvg xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 width%3D%22240%22 height%3D%22240%22 viewBox%3D%220 0 240 240%22%3E %3Cg stroke%3D%22%23FFFFFF%22 stroke-width%3D%221.6%22 fill%3D%22none%22 stroke-linecap%3D%22square%22%3E %3Cg transform%3D%22translate(18%2C18)%22%3E%3Cpath d%3D%22M0 0 h52 v52 h-41.6 v-41.6 h31.2 v31.2 h-20.8 v-20.8 h10.4%22%3E%3C%2Fpath%3E%3C%2Fg%3E %3Cg transform%3D%22translate(222%2C96) rotate(90)%22%3E%3Cpath d%3D%22M0 0 h52 v52 h-41.6 v-41.6 h31.2 v31.2 h-20.8 v-20.8 h10.4%22%3E%3C%2Fpath%3E%3C%2Fg%3E %3Cg transform%3D%22translate(150%2C222) rotate(180)%22%3E%3Cpath d%3D%22M0 0 h44 v44 h-35.2 v-35.2 h26.4 v26.4 h-17.6 v-17.6 h8.8%22%3E%3C%2Fpath%3E%3C%2Fg%3E %3Cg transform%3D%22translate(18%2C150) rotate(270) translate(-44%2C0)%22%3E%3Cpath d%3D%22M0 0 h44 v44 h-35.2 v-35.2 h26.4 v26.4 h-17.6 v-17.6 h8.8%22%3E%3C%2Fpath%3E%3C%2Fg%3E %3Cg transform%3D%22translate(96%2C44)%22%3E%3Cpath d%3D%22M0 0 h12 v-12 h12 v-12 h12 v-12 h12 v-12 h12 v-12%22%3E%3C%2Fpath%3E%3C%2Fg%3E %3Cg transform%3D%22translate(210%2C150) rotate(135)%22%3E%3Cpath d%3D%22M0 0 h12 v-12 h12 v-12 h12 v-12 h12 v-12 h12 v-12%22%3E%3C%2Fpath%3E%3C%2Fg%3E %3Cg transform%3D%22translate(44%2C206) rotate(-45)%22%3E%3Cpath d%3D%22M0 0 h12 v-12 h12 v-12 h12 v-12 h12 v-12 h12 v-12%22%3E%3C%2Fpath%3E%3C%2Fg%3E %3Cg transform%3D%22translate(120%2C120) rotate(45)%22%3E%3Crect x%3D%22-14%22 y%3D%22-14%22 width%3D%2228%22 height%3D%2228%22%3E%3C%2Frect%3E%3Crect x%3D%22-7%22 y%3D%22-7%22 width%3D%2214%22 height%3D%2214%22%3E%3C%2Frect%3E%3C%2Fg%3E %3C%2Fg%3E %3Cg fill%3D%22%23FFFFFF%22 stroke%3D%22none%22%3E %3Crect x%3D%22116%22 y%3D%2220%22 width%3D%228%22 height%3D%228%22 transform%3D%22rotate(45 120 24)%22%3E%3C%2Frect%3E %3Crect x%3D%2220%22 y%3D%22116%22 width%3D%228%22 height%3D%228%22 transform%3D%22rotate(45 24 120)%22%3E%3C%2Frect%3E %3Crect x%3D%22212%22 y%3D%22116%22 width%3D%228%22 height%3D%228%22 transform%3D%22rotate(45 216 120)%22%3E%3C%2Frect%3E %3Crect x%3D%22116%22 y%3D%22212%22 width%3D%228%22 height%3D%228%22 transform%3D%22rotate(45 120 216)%22%3E%3C%2Frect%3E %3C%2Fg%3E %3C%2Fsvg%3E"); background-size: 130px 130px; opacity: 0.16; display: block; }
  #bp-egna .eg-bak-tint { position: absolute; inset: 0; background: linear-gradient(118deg, rgba(255,61,180,0.10), rgba(255,211,77,0.06) 30%, rgba(183,255,46,0.05) 55%, rgba(64,224,255,0.10) 80%); display: block; }
  #bp-egna .eg-bak-vig { position: absolute; inset: 0; background: radial-gradient(ellipse 60% 44% at 50% 46%, rgba(255,61,180,0.14), transparent 70%), radial-gradient(ellipse at 50% 42%, transparent 30%, rgba(0,0,0,0.55) 100%); display: block; }
  #bp-egna .eg-bak-logo { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 16px; }
  #bp-egna .eg-glyf { position: relative; width: 96px; height: 108px; display: inline-block; }
  #bp-egna .eg-glyf-w { position: absolute; left: 0; top: 8px; width: 68px; height: 92px; border-radius: 10px; background: linear-gradient(180deg, #FFFFFF 0%, #EDF2F8 38%, #C9D6E4 48%, #8FA3BA 52%, #E9EFF6 63%, #FFFFFF 100%); transform: rotate(-11deg); display: block; }
  #bp-egna .eg-glyf-p { position: absolute; right: 0; top: 0; width: 68px; height: 92px; border-radius: 10px; background: #FF3DB4; display: flex; align-items: center; justify-content: center; }
  #bp-egna .eg-glyf-b { font-family: 'Anton', 'Anton-fallback', sans-serif; font-size: 50px; color: #FFFFFF; transform: skewX(-6deg); line-height: 1; }
  #bp-egna .eg-ord { display: inline-block; transform: skewX(-7deg) rotate(-1.5deg); }
  #bp-egna .eg-ord span { font-family: 'Anton', 'Anton-fallback', sans-serif; font-size: 30px; letter-spacing: 0.0155em; display: inline-block; transform: scaleX(1.05); transform-origin: 0 50%; margin-right: 0.26em; -webkit-text-stroke: 0.0086em transparent; background: linear-gradient(180deg, #FFFFFF 0%, #EDF2F8 38%, #C9D6E4 48%, #8FA3BA 52%, #E9EFF6 63%, #FFFFFF 100%); -webkit-background-clip: text; background-clip: text; color: transparent; }
  #bp-egna .eg-bak-pill { position: absolute; left: 10px; top: 10px; font-size: 9px; font-weight: 800; letter-spacing: 0.1em; color: #08090B; background: #FF3DB4; border-radius: 999px; padding: 3px 8px; }
  #bp-egna .eg-pv-note { font-size: 11.5px; color: #6F7380; line-height: 1.5; }
  #bp-egna .eg-pv-r { flex: 1 1 320px; min-width: 0; display: flex; flex-direction: column; gap: 11px; }
  #bp-egna .eg-fotos { display: flex; gap: 8px; }
  #bp-egna .eg-fotob { position: relative; width: 56px; height: 74px; border-radius: 8px; overflow: hidden; border: 1px solid rgba(255,255,255,0.16); background: #14161C; cursor: pointer; padding: 0; }
  #bp-egna .eg-fotob.eg-on { border: 3px solid #FF3DB4; }
  #bp-egna .eg-fotob span { position: absolute; inset: 0; background-size: cover; background-position: center; display: block; }
  #bp-egna .eg-chips { display: flex; gap: 6px; flex-wrap: wrap; }
  #bp-egna .eg-chip { font-size: 12px; font-weight: 600; padding: 7px 15px; border-radius: 999px; background: transparent; border: 1px solid rgba(255,255,255,0.16); color: #C4C7D4; display: inline-block; cursor: pointer; font-family: inherit; }
  #bp-egna .eg-chip.eg-on { background: #FF3DB4; border-color: #FF3DB4; color: #08090B; }
  #bp-egna .eg-agchip { background: rgba(255,255,255,0.03); cursor: default; }
  #bp-egna .eg-agchip.eg-on { background: #FF3DB4; }
  #bp-egna .eg-ag-not { font-size: 11px; color: #6F7380; }
  #bp-egna .eg-bakval { display: flex; flex-direction: column; gap: 8px; }
  #bp-egna .eg-bakrad { display: flex; align-items: center; gap: 10px; border: 1px solid rgba(255,255,255,0.14); background: rgba(255,255,255,0.03); border-radius: 12px; padding: 9px 12px; }
  #bp-egna .eg-bakrad.eg-on { border: 3px solid #FF3DB4; background: rgba(255,61,180,0.08); }
  #bp-egna .eg-bakrad svg { flex-shrink: 0; }
  #bp-egna .eg-mini { position: relative; width: 24px; height: 28px; flex-shrink: 0; display: inline-block; }
  #bp-egna .eg-mini-w { position: absolute; left: 0; top: 2px; width: 17px; height: 23px; border-radius: 3px; background: #C7C9CE; transform: rotate(-11deg); display: block; }
  #bp-egna .eg-mini-p { position: absolute; right: 0; top: 0; width: 17px; height: 23px; border-radius: 3px; background: #7A7D85; display: flex; align-items: center; justify-content: center; }
  #bp-egna .eg-mini-b { font-family: 'Anton', 'Anton-fallback', sans-serif; font-size: 12px; color: #E8E9EC; transform: skewX(-6deg); line-height: 1; }
  #bp-egna .eg-bakrad-tx { display: flex; flex-direction: column; gap: 1px; min-width: 0; flex: 1; }
  #bp-egna .eg-bakrad-t { font-size: 12.5px; font-weight: 700; }
  #bp-egna .eg-bakrad-d { font-size: 10.5px; color: #9CA0AE; }
  #bp-egna .eg-nt { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
  #bp-egna .eg-falt { border: 1px solid rgba(255,255,255,0.14); border-radius: 10px; background: rgba(255,255,255,0.03); padding: 8px 12px; display: flex; flex-direction: column; gap: 1px; }
  #bp-egna .eg-falt-l { font-size: 9px; letter-spacing: 0.08em; text-transform: uppercase; color: #6F7380; }
  #bp-egna .eg-falt-v { font-size: 13px; font-weight: 600; }
  #bp-egna .eg-falt-g { font-size: 13px; color: #9CA0AE; }
  #bp-egna .eg-skapa { align-self: flex-start; font-family: 'Anton', 'Anton-fallback', sans-serif; font-size: 15px; letter-spacing: 0.05em; color: #08090B; background: #FF3DB4; padding: 11px 26px 9px; transform: skewX(-6deg); box-shadow: 3px 4px 0 rgba(0,0,0,0.6); display: inline-block; cursor: pointer; border: 0; }
  #bp-egna .eg-skapa > span { display: inline-block; transform: skewX(6deg); }
  #bp-egna .eg-andra { display: none; flex-direction: column; gap: 11px; }
  #bp-egna .eg-andra.eg-on { display: flex; }
  #bp-egna .eg-nytt { align-self: flex-start; font-family: 'Anton', 'Anton-fallback', sans-serif; font-size: 12px; letter-spacing: 0.05em; color: #C4C7D4; border: 1px solid rgba(255,255,255,0.2); padding: 7px 15px 5px; transform: skewX(-6deg); display: inline-block; cursor: pointer; background: transparent; }
  #bp-egna .eg-nytt > span { display: inline-block; transform: skewX(6deg); }
  #bp-egna .eg-pv-p { margin: 4px 0 0; font-size: 12.5px; line-height: 1.6; color: #6F7380; }

  /* 06 Så här blir det */
  #bp-egna .eg-b06-h { display: flex; flex-direction: column; gap: 12px; align-items: center; text-align: center; }
  #bp-egna .eg-b06-h .eg-h2 { font-size: clamp(30px, 3.4vw, 46px); }
  #bp-egna .eg-b06-h .eg-marker { font-size: 20px; align-self: auto; }
  #bp-egna .eg-blir { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
  #bp-egna .eg-blirt { position: relative; height: 760px; border-radius: 18px; overflow: hidden; border: 1px solid rgba(255,255,255,0.10); background: #050608; }
  #bp-egna .eg-blirt.eg-on { border: 1.5px solid rgba(255,61,180,0.45); }
  #bp-egna .eg-blirt-pack:hover { border-color: #FF3DB4; }
  #bp-egna .eg-blirt img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; padding: 14px 14px 60px; }
  #bp-egna .eg-blir-lab { position: absolute; left: 14px; bottom: 14px; z-index: 2; font-family: 'Anton', 'Anton-fallback', sans-serif; font-size: 16px; letter-spacing: 0.05em; color: #FFFFFF; background: rgba(6,7,9,0.7); padding: 7px 14px 5px; transform: skewX(-4deg); }
  #bp-egna .eg-blir-lab-p { color: #08090B; background: #FF3DB4; }

  /* Tryckteknik & material */
  #bp-egna .eg-spec { display: grid; grid-template-columns: auto 1fr; gap: 7px 22px; font-size: 13px; border: 1px solid rgba(255,255,255,0.10); border-radius: 14px; background: rgba(255,255,255,0.03); padding: 18px 20px; }
  #bp-egna .eg-spec-k { color: #9CA0AE; }
  #bp-egna .eg-spec-v { font-weight: 600; }
  #bp-egna .eg-spec-n { font-size: 13px; color: #6F7380; }
  #bp-egna .eg-makro { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
  #bp-egna .eg-makrot { position: relative; height: 300px; border-radius: 14px; overflow: hidden; border: 1px solid rgba(255,255,255,0.10); }
  #bp-egna .eg-makrot img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
  #bp-egna .eg-makro-lab { position: absolute; left: 10px; bottom: 10px; z-index: 2; font-size: 11px; font-weight: 600; letter-spacing: 0.06em; color: #FFFFFF; background: rgba(6,7,9,0.7); padding: 4px 10px; border-radius: 999px; }

  /* ── Föranmälan ── */
  #bp-egna .eg-fa { position: relative; max-width: 1208px; margin: 72px auto 80px; width: calc(100% - 72px); overflow: hidden; border-radius: 28px; background: #0A0B10; border: 1px solid rgba(255,255,255,0.08); box-shadow: 0 40px 90px rgba(0,0,0,0.65); }
  #bp-egna .eg-fa-glow { position: absolute; right: -10%; top: -30%; width: 640px; height: 640px; background: radial-gradient(circle, rgba(255,61,180,0.22) 0%, rgba(124,92,255,0.10) 45%, transparent 70%); filter: blur(40px); pointer-events: none; }
  #bp-egna .eg-fa-grid { position: relative; display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 0.9fr); gap: 24px; align-items: center; padding: 54px 0 54px 54px; }
  #bp-egna .eg-fa-l { display: flex; flex-direction: column; gap: 16px; }
  #bp-egna .eg-fa-k { font-size: 12px; font-weight: 700; letter-spacing: 0.24em; color: #FF3DB4; }
  #bp-egna .eg-fa-h2 { font-family: 'Anton', 'Anton-fallback', sans-serif; font-weight: 400; font-size: clamp(34px, 3.8vw, 54px); letter-spacing: 0.015em; line-height: 0.98; text-transform: uppercase; transform: skewX(-3deg); }
  #bp-egna .eg-form { display: flex; gap: 10px; align-items: stretch; flex-wrap: wrap; margin-top: 2px; }
  #bp-egna .eg-inp { flex: 0 1 280px; border: 1px solid rgba(255,255,255,0.16); border-radius: 999px; padding: 15px 22px; font-size: 15px; color: #F2F3F7; background: rgba(255,255,255,0.05); min-width: 0; outline: none; font-family: inherit; line-height: normal; }
  #bp-egna .eg-inp::placeholder { color: #9CA0AE; opacity: 1; }
  #bp-egna .eg-inp:focus { border-color: #FF3DB4; }
  #bp-egna .eg-fa-btn { padding: 15px 30px 13px; display: inline-flex; align-items: center; }
  #bp-egna .eg-fa-ok { display: flex; gap: 20px; align-items: center; flex-wrap: wrap; font-size: 13px; font-weight: 500; color: #9CA0AE; }
  #bp-egna .eg-form-svar { flex-basis: 100%; font-family: 'Anton', 'Anton-fallback', sans-serif; letter-spacing: 0.04em; text-transform: uppercase; font-size: 15px; padding: 4px 2px; color: #B7FF2E; }
  #bp-egna .eg-form-svar.eg-fel { color: #FF5C5C; }
  #bp-egna .eg-form.eg-klar .eg-inp, #bp-egna .eg-form.eg-klar .eg-fa-btn { display: none; }
  #bp-egna .eg-fa-ok span { display: inline-flex; align-items: center; gap: 7px; }
  #bp-egna .eg-fa-ok i { font-style: normal; color: #4ADE80; }
  #bp-egna .eg-fa-l .eg-marker { font-size: 19px; }
  #bp-egna .eg-fa-r { position: relative; height: 440px; display: flex; align-items: center; justify-content: center; animation: egFloat 7.5s ease-in-out infinite; }
  #bp-egna .eg-fa-r img { border-radius: 10px; height: auto; display: block; }
  #bp-egna .eg-fa-k1 { width: 37%; transform: rotate(-12deg) translateX(24%); box-shadow: 0 24px 48px rgba(0,0,0,0.65); }
  #bp-egna .eg-fa-k2 { width: 42%; transform: translateY(-12px); box-shadow: 0 30px 56px rgba(0,0,0,0.75); position: relative; z-index: 2; }
  #bp-egna .eg-fa-k3 { width: 37%; transform: rotate(12deg) translateX(-24%); box-shadow: 0 24px 48px rgba(0,0,0,0.65); }

  /* ── Nedry-rutan ── */
  #bp-egna .eg-nedry { position: fixed; inset: 0; z-index: 90; background: rgba(4,5,7,0.82); display: none; align-items: center; justify-content: center; cursor: pointer; }
  #bp-egna .eg-nedry.eg-on { display: flex; }
  #bp-egna .eg-nedry-box { background: #0C0E12; border: 1.5px solid rgba(255,61,180,0.5); border-radius: 18px; padding: 22px; max-width: 420px; width: calc(100% - 60px); display: flex; flex-direction: column; gap: 12px; box-shadow: 0 40px 90px rgba(0,0,0,0.7); cursor: default; }
  #bp-egna .eg-nedry-gif { height: 260px; border-radius: 12px; overflow: hidden; background: #14161C; }
  #bp-egna .eg-nedry-gif img { width: 100%; height: 100%; object-fit: cover; display: block; }
  #bp-egna .eg-nedry-t { font-family: 'Anton', 'Anton-fallback', sans-serif; font-size: 20px; letter-spacing: 0.03em; text-transform: uppercase; transform: skewX(-3deg); }
  #bp-egna .eg-nedry-d { font-size: 13.5px; line-height: 1.6; color: #9CA0AE; }
  #bp-egna .eg-nedry-b { align-self: flex-start; font-size: 14px; padding: 10px 20px 8px; box-shadow: 3px 4px 0 rgba(0,0,0,0.6); }

  /* ── Scrollstyrd demo: muspekare + orderpill (döljs under 760 px) ── */
  #bp-egna .eg-pip { position: fixed; left: 0; top: 0; z-index: 70; pointer-events: none; transition: transform 0.85s cubic-bezier(0.3, 0.8, 0.3, 1); display: none; }
  #bp-egna .eg-order { position: fixed; left: 22px; bottom: 18px; z-index: 65; pointer-events: none; display: none; }
  #bp-egna.eg-story .eg-pip, #bp-egna.eg-story .eg-order { display: block; }
  #bp-egna .eg-pip-fill { position: absolute; left: -14px; top: -14px; width: 34px; height: 34px; border-radius: 50%; background: rgba(255,61,180,0); transition: background 0.2s ease; display: block; }
  #bp-egna .eg-pip svg { position: absolute; left: -3px; top: -2px; filter: drop-shadow(0 2px 6px rgba(0,0,0,0.7)); }
  #bp-egna .eg-drag { position: absolute; left: 16px; top: 18px; display: none; opacity: 0.92; }
  #bp-egna .eg-drag.eg-on { display: block; }
  #bp-egna .eg-drag-a { position: absolute; left: 9px; top: -6px; width: 46px; height: 62px; border-radius: 4px; background-size: cover; background-position: center; transform: rotate(6deg); box-shadow: 0 6px 16px rgba(0,0,0,0.5); display: block; }
  #bp-egna .eg-drag-b { position: absolute; left: -9px; top: -3px; width: 46px; height: 62px; border-radius: 4px; background-size: cover; background-position: center; transform: rotate(-6deg); box-shadow: 0 6px 16px rgba(0,0,0,0.5); display: block; }
  #bp-egna .eg-drag-c { position: relative; width: 48px; height: 64px; border-radius: 4px; background-size: cover; background-position: center; border: 1px solid rgba(255,255,255,0.6); box-shadow: 0 8px 20px rgba(0,0,0,0.6); display: block; }
  #bp-egna .eg-drag-n { position: absolute; right: -12px; top: -12px; min-width: 20px; height: 20px; border-radius: 999px; background: #0078D4; color: #FFFFFF; font-size: 11px; font-weight: 700; display: flex; align-items: center; justify-content: center; padding: 0 5px; font-family: 'Segoe UI', 'Geist', sans-serif; }
  #bp-egna .eg-drag-t { position: absolute; left: 50%; bottom: -24px; transform: translateX(-50%); background: #0078D4; color: #FFFFFF; font-size: 10.5px; font-weight: 600; font-family: 'Segoe UI', 'Geist', sans-serif; padding: 2px 8px; border-radius: 3px; white-space: nowrap; }
  #bp-egna .eg-order-box { display: inline-flex; align-items: baseline; gap: 12px; background: #0C0E12; border-left: 4px solid #FF3DB4; padding: 11px 20px 9px; transform: skewX(-6deg); box-shadow: 4px 5px 0 rgba(0,0,0,0.7); }
  #bp-egna .eg-order-in { display: inline-flex; align-items: baseline; gap: 12px; transform: skewX(6deg); }
  #bp-egna .eg-order-l { font-family: 'Anton', 'Anton-fallback', sans-serif; font-size: 12px; letter-spacing: 0.08em; text-transform: uppercase; color: #9CA0AE; }
  #bp-egna .eg-order-d { font-size: 13px; font-weight: 600; color: #F2F3F7; }
  #bp-egna .eg-order-p { font-family: 'Anton', 'Anton-fallback', sans-serif; font-size: 18px; letter-spacing: 0.04em; color: #FF3DB4; }

  /* Mobil (facitens .m2/.m4/.m6/.mh/.mpad vid 760 px) */
  @media (max-width: 760px) {
    #bp-egna .eg-m2 { grid-template-columns: minmax(0, 1fr) !important; gap: 24px !important; }
    #bp-egna .eg-m4 { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
    #bp-egna .eg-m6 { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
    #bp-egna .eg-mpad { padding: 36px 24px !important; }
    #bp-egna .eg-hero-txt { margin-bottom: 0; }
    #bp-egna .eg-mh { height: 380px !important; }
  }

  /* ── Mobilen efter Dans granskning i iPhone 2026-09-24 ──
     Promon först och nästan kant i kant, texten ovanför bilderna i varje steg, kortare text (.eg-m-dold
     bär bisatser som bara visas på datorn, .eg-d-dold mobilens egna varianter), kort 1–4 och fram-/baksidan
     sida vid sida i steg 05, och demopekaren som en tryckpunkt. Prototypens .storypip stängde av pekaren
     och orderpillen under 760 px, så demon bytte val utan synlig orsak ("animationen funkar inte alls på
     mobilen"). Allt här ligger i mobilfrågan — datorn är facit och rörs inte. */
  @media not all and (max-width: 760px) {
    #bp-egna .eg-d-dold { display: none !important; }
  }
  @media (max-width: 760px) {
    #bp-egna .eg-m-dold { display: none !important; }
    #bp-egna .eg-p { text-wrap: pretty; }

    /* Hero: scenen först, kant i kant. Bildytan är 0,88 av bredden: de breda scenerna (solfjädrarna, 1,54:1)
       fyller hela bredden och de nästan kvadratiska packen 85 % av den, utan en tom rymd ovanför solfjädrarna */
    #bp-egna .eg-hero-in { padding: 0 36px 44px; }
    #bp-egna .eg-hero-in.eg-m2 { gap: 10px !important; }
    #bp-egna .eg-scen { order: -1; margin: 0 -36px; height: calc(min(100vw - 24px, 480px) * 0.88 + 62px); overflow: hidden; }
    #bp-egna .eg-slide-in { left: 12px; right: 12px; bottom: 62px; }
    /* De breda solfjädrarna (scen 2 och 4) står mitt i bildytan i stället för på botten, med speglingen
       under bilden i stället för under hela ytan: annars blev det 85 px tom rymd ovanför dem */
    #bp-egna .eg-s2 .eg-slide-in, #bp-egna .eg-s4 .eg-slide-in { align-items: center; }
    #bp-egna .eg-s2 .eg-sway, #bp-egna .eg-s4 .eg-sway { height: auto; align-items: center; }
    #bp-egna .eg-s2 .eg-obj, #bp-egna .eg-s4 .eg-obj { height: auto; max-width: min(100%, 620px); }
    #bp-egna .eg-s2 .eg-oimg, #bp-egna .eg-s4 .eg-oimg { max-height: none; width: 100%; }
    #bp-egna .eg-refl { -webkit-mask-image: linear-gradient(to top, rgba(0,0,0,0.18), transparent 52px); mask-image: linear-gradient(to top, rgba(0,0,0,0.18), transparent 52px); }
    /* Ingen drop-shadow på packen i mobilen. Dan såg "svart till vänster" om Sven- och Dan-packen i
       iPhonen, och de två är de enda scenerna med filtret. Bildfilerna är rena, se README. Speglingen
       och glöden räcker som mark under packen. */
    #bp-egna .eg-oimg.eg-skugga { filter: none; }
    #bp-egna .eg-glow { width: 120%; height: 72%; }
    #bp-egna .eg-dots { bottom: 16px; }
    /* Texten i pull-bandets form (startsidan, Dan 2026-09-24): rubrik på två rader, H1:an på en rad,
       markertext, kort text. En knapp; föranmälan är en länk under den i stället för en andra knapp. */
    #bp-egna .eg-hero-txt { gap: 14px; }
    /* "ÄKTA SAMLARKORT." fyller spalten på en rad vid alla bredder (7,5 × teckenstorleken bred) */
    #bp-egna .eg-h1 { font-size: min(calc((100vw - 72px) * 0.13), 58px); }
    #bp-egna .eg-seo-h1 { font-size: 17px; max-width: none; }
    #bp-egna .eg-tag { font-size: 13px; padding: 5px 10px 4px; }
    #bp-egna .eg-ingress { font-size: 17px; line-height: 1.55; }
    #bp-egna .eg-cta { flex-direction: column; align-items: stretch; gap: 6px; margin-top: 6px; }
    #bp-egna .eg-cta .eg-btn-p { text-align: center; padding-left: 14px; padding-right: 14px; }
    /* Sekundärknappen som på datorn: ram, Anton, versaler, snedställd, i full bredd under primärknappen
       (Dan 2026-09-25: "inte ha rosa streck på vit text" — textlänken med rosa understrykning är borta).
       Texten krymper på smala skärmar så att "ANMÄL INTRESSE — RABATTKOD VID SLÄPP" ryms på en rad. */
    #bp-egna .eg-cta .eg-btn-s { text-align: center; padding-left: 12px; padding-right: 12px; font-size: min(15px, calc((100vw - 72px) / 21.5)); }

    /* Stegen: numret och rubriken på en rad, texten före bilderna även i 02 och 04 */
    #bp-egna .eg-steg { padding: 48px 36px 8px; gap: 56px; }
    #bp-egna .eg-kol { display: grid; grid-template-columns: auto minmax(0, 1fr); column-gap: 14px; row-gap: 12px; align-items: end; }
    #bp-egna .eg-kol > * { grid-column: 1 / -1; }
    #bp-egna .eg-kol > .eg-num { grid-column: 1; font-size: 50px; }
    #bp-egna .eg-kol > .eg-num + .eg-h2 { grid-column: 2; padding-bottom: 3px; }
    #bp-egna .eg-b06-h .eg-num { font-size: 50px; }
    #bp-egna .eg-b02 > .eg-kol, #bp-egna .eg-b04 > .eg-kol { order: -1; }
    #bp-egna .eg-b01.eg-m2, #bp-egna .eg-b02.eg-m2, #bp-egna .eg-b03.eg-m2, #bp-egna .eg-b04.eg-m2 { gap: 20px !important; }

    /* 02: pack och slab sida vid sida */
    #bp-egna .eg-valgrid.eg-m2 { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 10px !important; }
    #bp-egna .eg-val { height: clamp(270px, 60vw, 440px); border-radius: 16px; }
    #bp-egna .eg-val-pack .eg-val-img { padding: 30px 8px 66px; }
    #bp-egna .eg-val-slab .eg-val-img { padding: 36px 8px 66px; }
    #bp-egna .eg-val-stick { top: 10px; right: 7px; font-size: 10.5px; }
    #bp-egna .eg-valt { top: 9px; left: 7px; font-size: 9px; padding: 4px 7px; letter-spacing: 0.06em; }
    #bp-egna .eg-val-bot { left: 12px; right: 12px; bottom: 12px; }
    #bp-egna .eg-val-rad { flex-direction: column; align-items: flex-start; gap: 6px; }
    #bp-egna .eg-val-n { font-size: 24px; line-height: 1; }
    #bp-egna .eg-val-p { font-size: 12.5px; padding: 4px 8px 3px; }
    #bp-egna .eg-val-d { display: none; }

    /* 03: fyra antal på en rad, wrapprarna sida vid sida */
    #bp-egna .eg-antalgrid.eg-m4 { grid-template-columns: repeat(4, minmax(0, 1fr)) !important; gap: 8px; }
    #bp-egna .eg-antal { padding: 12px 3px 9px; }
    #bp-egna .eg-antal-n { font-size: 22px; }
    #bp-egna .eg-antal .eg-plate { font-size: 11px; padding: 3px 6px 2px; }
    #bp-egna .eg-antal-stick { font-size: 11px; top: -10px; }
    #bp-egna .eg-wrapgrid.eg-m2 { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 10px !important; }
    #bp-egna .eg-wrap { height: clamp(250px, 56vw, 420px); border-radius: 14px; }
    #bp-egna .eg-wrap-img { padding: 14px 10px 44px; }
    #bp-egna .eg-wrap-p { right: 8px; bottom: 10px; font-size: 11px; padding: 5px 7px 4px; }
    #bp-egna .eg-wrap-lab { left: 8px; bottom: 10px; font-size: 11px; padding: 5px 7px 4px; letter-spacing: 0.04em; }
    #bp-egna .eg-slabtile { height: clamp(300px, 64vw, 470px); border-radius: 14px; }
    #bp-egna .eg-slabtile img { padding: 12px 12px 48px; }
    #bp-egna .eg-slab-lab { left: 9px; bottom: 10px; font-size: 12px; padding: 5px 9px 4px; }

    /* 04 */
    #bp-egna .eg-alla { padding: 12px 18px 10px; }
    #bp-egna .eg-upp { padding: 16px; gap: 12px; border-radius: 16px; }
    #bp-egna .eg-drop { padding: 22px 14px 20px; }
    #bp-egna .eg-drop-t { font-size: 19px; }

    /* 05: kort 1–4 på en rad, fram- och baksidan sida vid sida, kontrollerna under */
    #bp-egna .eg-pv { padding: 14px; gap: 18px; border-radius: 16px; }
    #bp-egna .eg-kort { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
    #bp-egna .eg-kortb { flex-direction: column; align-items: center; gap: 6px; padding: 7px 3px 8px; min-width: 0; }
    #bp-egna .eg-kortb-tx { align-items: center; }
    #bp-egna .eg-kortb-t { display: none; }
    #bp-egna .eg-kortb-n { font-size: 12px; white-space: nowrap; }
    #bp-egna .eg-pv-main { gap: 20px; }
    #bp-egna .eg-pv-l { width: auto; flex: 1 1 100%; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; align-items: stretch; }
    #bp-egna .eg-pv-note { grid-column: 1 / -1; }
    #bp-egna .eg-pv-float { animation: none; }
    #bp-egna .eg-pv-frame { padding: 5px; border-radius: 12px; }
    #bp-egna .eg-pv-frame:hover { transform: none; }
    #bp-egna .eg-pv-in { border-radius: 8px; }
    #bp-egna .eg-pv-stage { height: auto; aspect-ratio: 63.5 / 88.9; }
    #bp-egna .eg-pv-tom { margin: 8px; gap: 6px; padding: 0 6px; }
    #bp-egna .eg-pv-tom-n { font-size: 34px; }
    #bp-egna .eg-pv-tom-t { font-size: 11px; line-height: 1.35; text-align: center; }
    #bp-egna .eg-pv-foto-img { inset: 12px 12px 40px; }
    #bp-egna .eg-pv-foto-t { bottom: 10px; padding: 0 6px; font-size: 11px; }
    #bp-egna .eg-pv-spin-t { padding: 0 6px; font-size: 11px; text-align: center; }
    #bp-egna .eg-bak { aspect-ratio: auto; border-radius: 12px; }
    #bp-egna .eg-bak-ram { inset: 8px; border-radius: 6px; }
    #bp-egna .eg-bak-m { background-size: 80px 80px; }
    #bp-egna .eg-bak-logo { transform: scale(0.56); }
    #bp-egna .eg-bak-pill { left: 7px; top: 7px; font-size: 8px; padding: 2px 6px; }
    #bp-egna .eg-bakrad-d { display: none; }
    #bp-egna .eg-bakrad { gap: 9px; padding: 9px 10px; }
    #bp-egna .eg-bakrad .eg-plate { font-size: 11px; padding: 3px 7px 2px; }
    #bp-egna .eg-chip { padding: 9px 14px; }
    #bp-egna .eg-falt-l { font-size: 10px; }

    /* 06 och tryckteknik: makrobilderna två och två */
    #bp-egna .eg-b06-h .eg-marker { font-size: 17px; text-wrap: balance; }
    #bp-egna .eg-blir.eg-m2 { gap: 12px !important; }
    #bp-egna .eg-makro.eg-m2 { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 10px !important; }
    #bp-egna .eg-makrot { height: clamp(170px, 40vw, 300px); border-radius: 12px; }
    #bp-egna .eg-makro-lab { left: 8px; bottom: 8px; font-size: 10px; padding: 3px 8px; }
    #bp-egna .eg-spec { gap: 6px 16px; padding: 14px 16px; }

    /* Föranmälan */
    #bp-egna .eg-fa { margin: 56px auto 64px; border-radius: 22px; }
    #bp-egna .eg-fa-k { display: none; }
    /* Rubriken och markertexten på hela rader vid alla bredder: "NÄR VI ÖPPNAR." och "FIRST COME, FIRST RIPPED"
       bröts mitt i frasen vid 320 px */
    #bp-egna .eg-fa-l .eg-fa-h2 { order: -2; font-size: min(calc((100vw - 120px) * 0.16), 50px); }
    #bp-egna .eg-fa-l .eg-marker { order: -1; font-size: min(21px, calc((100vw - 120px) / 11.6)); white-space: nowrap; margin-top: -2px; }
    #bp-egna .eg-fa-k1, #bp-egna .eg-fa-k3 { width: 44%; }
    #bp-egna .eg-fa-k2 { width: 50%; }
    /* 16 px: iOS Safari zoomar in sidan när ett fält under 16 px får fokus (sidans viewport tillåter zoom) */
    #bp-egna .eg-inp { flex: 1 1 100%; width: 100%; font-size: 16px; }
    #bp-egna .eg-fa-btn { flex: 1 1 100%; justify-content: center; }
    #bp-egna .eg-fa-ok { gap: 8px 16px; }
    /* Korten överst och stora, men solfjädern håller sig innanför rutans rundade hörn (10 % luft per sida) */
    #bp-egna .eg-fa-r { order: -1; box-sizing: border-box; width: 100%; max-width: 440px; justify-self: center; padding: 0 10%; height: clamp(230px, 58vw, 330px); margin-bottom: -4px; }

    /* Demon: pekaren blir en tryckpunkt (ring, rosa vid tryck) utan datorns pil och "+ Kopiera"-lapp,
       orderpillen centrerad och kompakt */
    #bp-egna .eg-pip svg, #bp-egna .eg-drag-t { display: none; }
    #bp-egna .eg-pip-fill { left: -17px; top: -17px; width: 30px; height: 30px; border: 2px solid rgba(255,255,255,0.92); box-shadow: 0 0 0 6px rgba(255,255,255,0.12), 0 6px 18px rgba(0,0,0,0.6); }
    #bp-egna .eg-order { left: 12px; right: 12px; bottom: calc(12px + env(safe-area-inset-bottom, 0px)); text-align: center; }
    #bp-egna .eg-order-box { padding: 9px 14px 7px; box-shadow: 3px 4px 0 rgba(0,0,0,0.7); }
    #bp-egna .eg-order-in { gap: 9px; }
    #bp-egna .eg-order-l { font-size: 10.5px; }
    #bp-egna .eg-order-d { font-size: 12px; white-space: nowrap; }
    #bp-egna .eg-order-p { font-size: 16px; white-space: nowrap; }
  }
  @media (max-width: 380px) {
    #bp-egna .eg-val.eg-on .eg-val-stick { top: 34px; }
  }
  /* Pekskärmar har ingen hover: iOS behåller :hover efter ett tryck, så knappen blev vit och
     förhandsvisningen stod snett tills man tryckte någon annanstans. */
  @media (hover: none) {
    /* iOS lägger en grå rektangel över allt man trycker på; valen har egna rosa lägen */
    #bp-egna { -webkit-tap-highlight-color: transparent; }
    #bp-egna .eg-btn-p:hover { background: #FF3DB4; color: #08090B; transform: skewX(-6deg); box-shadow: 4px 5px 0 rgba(0,0,0,0.7); }
    #bp-egna .eg-nedry-b:hover { box-shadow: 3px 4px 0 rgba(0,0,0,0.6); }
    #bp-egna .eg-btn-s:hover { border-color: rgba(255,255,255,0.35); color: #F2F3F7; transform: skewX(-6deg); box-shadow: none; }
    #bp-egna .eg-pv-frame:hover { transform: none; }
    #bp-egna .eg-wrap-silver:hover:not(.eg-on), #bp-egna .eg-wrap-eget:hover:not(.eg-on), #bp-egna .eg-blirt-pack:hover:not(.eg-on) { border-color: rgba(255,255,255,0.10); }
    #bp-egna .eg-blirt-pack.eg-on:hover { border-color: rgba(255,61,180,0.45); }
    #bp-egna .eg-alla:hover { color: #C4C7D4; border-color: rgba(255,255,255,0.2); }
  }
  /* Alla animationer av vid prefers-reduced-motion (PROMPT.md); hero-showen fryser på första scenen */
  @media (prefers-reduced-motion: reduce) {
    #bp-egna *, #bp-egna *::before { animation: none !important; transition: none !important; }
    #bp-egna .eg-slide { opacity: 0; }
    #bp-egna .eg-s1 { opacity: 1; }
    #bp-egna .eg-dots span:nth-child(1) { background: #FF3DB4; }
    #bp-egna .eg-h1 { transform: skewX(-3deg); opacity: 1; }
  }
