/*
 * Electro Union OS — Postcard Generator (v2)
 *
 * Campaign-first layout. Not a tool, not a player — a world.
 * Two columns: postcard canvas (left, generous) + controls (right, clean).
 * EU blue desktop frames the white window. The postcard is the hero.
 *
 * IFRAME CONSTRAINT
 *   Cross-origin iframes (Webflow embed) kill CSS `transition` and
 *   `@keyframes`. All state changes are instant — JS-driven or DOM toggle.
 */

/* ─── FONTS ──────────────────────────────────────────────────────────── */
@font-face{
  font-family:'Stars Revenge';
  src:url('stars_revenge.ttf') format('truetype');
  font-weight:400 900;
  font-style:normal;
}
@font-face{
  font-family:'Villanesia';
  src:url('Villanesia.ttf') format('truetype');
  font-weight:400 900;
  font-style:normal;
}
@font-face{
  font-family:'OSP-DIN';
  src:url('OSP-DIN.ttf') format('truetype');
  font-weight:400 900;
  font-style:normal;
}

/* ═══════════════════════════════════════════════════════════════════════
   DESKTOP — EU blue. Warm boot, then you're in the brand.
   ═══════════════════════════════════════════════════════════════════════ */
.eu-os-body{
  margin:0;
  background:#fff;
  font-family:'Stars Revenge',Arial,sans-serif;
  color:#1a1a1a;
  min-height:100vh;
}
.eu-os{
  position:relative;
  min-height:100vh;
  padding:0 0 80px;
  display:flex;
  flex-direction:column;
  align-items:stretch;
}

/* ─── OPEN LETTER LINK ─── */
.eu-pg2__letter-link{
  display:flex;
  justify-content:center;
  align-items:center;
  padding:64px 24px;
  margin:0 0 80px;
  text-decoration:none;
}
.eu-pg2__letter-gif{
  display:block;
  max-width:100%;
  height:auto;
  transition:transform 200ms ease;
}
.eu-pg2__letter-link:hover .eu-pg2__letter-gif{ transform:scale(1.02); }

/* Intro GIF replacing the tagline */
.eu-pg2__intro-gif{
  display:block;
  max-width:100%;
  height:auto;
  margin:30px auto 28px;
}
/* Time-based desktop accents */
.eu-os-body.is-golden{ background:#f7f5f0; }
.eu-os-body.is-aperitivo{ background:#f5f3f7; }

/* ═══════════════════════════════════════════════════════════════════════
   BOOT LOADER — warm, photographic, immersive. Unchanged.
   ═══════════════════════════════════════════════════════════════════════ */
.eu-os__boot{
  position:fixed;
  inset:0;
  z-index:10000;
  background:#fff;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:20px;
}
.eu-os__boot[hidden]{display:none}
.eu-os__boot-panel{
  display:grid;
  grid-template-columns:minmax(220px,38%) 1fr;
  gap:0;
  width:min(820px,100%);
  background:#fff;
  border:1.5px solid #1a1a1a;
  border-radius:1px;
  box-shadow:4px 4px 0 rgba(0,0,0,.06),0 12px 36px rgba(0,0,0,.18);
  overflow:hidden;
}
.eu-os__boot-photo{
  position:relative;
  background:#000;
  overflow:hidden;
  min-height:240px;
}
.eu-os__boot-photo img{
  width:100%;height:100%;
  object-fit:cover;
  display:block;
  filter:contrast(1.05) saturate(.92);
}
.eu-os__boot-info{
  padding:24px 28px 22px;
  display:flex;
  flex-direction:column;
  gap:10px;
}
.eu-os__boot-mark{
  font-family:'Times Eighteen',Georgia,serif;
  font-size:clamp(34px,4vw,46px);
  line-height:1;
  letter-spacing:-.005em;
  color:#1a1a1a;
  display:flex;
  align-items:baseline;
  gap:10px;
  margin:0 0 4px;
}
.eu-os__boot-mark-bolt{ font-size:.7em; color:#2835D0; }
.eu-os__boot-version{
  font-family:'Stars Revenge',Arial,sans-serif;
  font-size:11px;letter-spacing:.04em;color:#1a1a1a;margin:0;font-weight:600;
}
.eu-os__boot-credits{
  font-family:'Times Eighteen',Georgia,serif;
  font-style:italic;font-size:13px;line-height:1.5;color:#3a3a3a;margin:6px 0 0;
}
.eu-os__boot-copyright{
  font-family:'Stars Revenge',Arial,sans-serif;
  font-size:10px;letter-spacing:.04em;color:#777;margin:0 0 14px;
}
.eu-os__boot-progress-row{
  display:flex;
  justify-content:space-between;align-items:baseline;
  font-family:'Stars Revenge',Arial,sans-serif;
  font-size:11px;letter-spacing:.04em;color:#1a1a1a;margin-top:auto;
}
.eu-os__boot-progress-pct{ font-weight:700; }
.eu-os__boot-progress{
  margin-top:8px;
  position:relative;
  height:18px;
  border:1.5px solid #1a1a1a;
  background:#fff;
  overflow:hidden;
}
.eu-os__boot-progress-fill{
  position:absolute;
  inset:2px auto 2px 2px;
  width:0%;
  background:repeating-linear-gradient(
    90deg,
    #2835D0 0 7px,
    transparent 7px 9px
  );
}

/* ═══════════════════════════════════════════════════════════════════════
   MENUBAR
   ═══════════════════════════════════════════════════════════════════════ */
.eu-os__menubar{
  position:fixed;
  top:0;left:0;right:0;
  z-index:200;
  height:34px;
  background:#fdfaf4;
  border-bottom:1.5px solid #1a1a1a;
  display:flex;align-items:center;justify-content:space-between;
  padding:0 14px;
  font-family:'Stars Revenge',Arial,sans-serif;
  font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:#1a1a1a;
}
.eu-os__menubar[hidden]{display:none}
.eu-os__menubar-cell{ display:inline-flex;align-items:center;gap:10px; }
.eu-os__menubar-cell--brand{
  border:1.5px solid #1a1a1a;
  padding:5px 10px 5px 8px;
  background:#fff;
}
.eu-os__menubar-bolt{
  display:inline-block;font-size:13px;line-height:1;
  color:#2835D0;transform:translateY(-1px);
}
.eu-os__menubar-link{ color:#1a1a1a;text-decoration:none;letter-spacing:.18em; }
.eu-os__menubar-link:hover{ color:#2835D0; }
.eu-os__menubar-cell--right{ gap:14px; }
.eu-os__menubar-sound{
  background:none;border:none;cursor:var(--eu-cursor);
  font-size:14px;line-height:1;padding:0 2px;color:#1a1a1a;
}
.eu-os__menubar-sound[aria-pressed="true"]{ opacity:.5; }
.eu-os__menubar-clock-dot{
  width:9px;height:9px;
  display:inline-block;border-radius:50%;
  border:1.5px solid #CC0000;background:#fff;
  text-indent:-9999px;overflow:hidden;margin-right:-2px;
}
.eu-os__menubar-clock,.eu-os__menubar-date{ font-variant-numeric:tabular-nums; }

/* ═══════════════════════════════════════════════════════════════════════
   CAMPAIGN BANNER — GREETINGS FROM THE ELECTRO UNION
   ═══════════════════════════════════════════════════════════════════════ */
.eu-pg2__campaign-banner{
  background:#fff;
  width:100%;
  overflow:hidden;
  box-sizing:border-box;
}
.eu-pg2__campaign-banner[hidden]{display:none}

/* Red rolling ticker strip */
.eu-pg2__banner-ticker-wrap{
  background:transparent;
  height:30px;
  overflow:hidden;
  display:flex;
  align-items:center;
  border-bottom:1px solid #111;
}
.eu-pg2__banner-ticker-track{
  display:flex;
  align-items:center;
  white-space:nowrap;
  will-change:transform;
}
.eu-pg2__banner-ticker-seg{
  font-family:'Times Eighteen',Georgia,serif;
  font-weight:bold;
  font-style:italic;
  font-size:12px;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:#111;
  flex-shrink:0;
}

/* Headline body */
.eu-pg2__banner-body{
  display:flex;
  align-items:center;
  justify-content:center;
  padding:20px 40px 224px;
  gap:0;
}

.eu-pg2__banner-text{
  text-align:center;
  flex:0 0 auto;
}
.eu-pg2__banner-sub{
  font-family:'Times Eighteen',Georgia,serif;
  font-weight:bold;
  font-size:clamp(28px,3.2vw,44px);
  color:#1a1a1a;
  text-transform:uppercase;
  letter-spacing:.04em;
  margin:0 0 2px;
  line-height:1;
}
.eu-pg2__banner-headline{
  font-family:'Times Eighteen',Georgia,serif;
  font-weight:bold;
  font-size:clamp(44px,7vw,96px);
  color:#1a1a1a;
  text-transform:uppercase;
  letter-spacing:-.025em;
  line-height:.92;
  margin:0;
  white-space:nowrap;
}

.eu-pg2__banner-stickers{
  display:flex;
  align-items:center;
  flex-shrink:0;
}
.eu-pg2__banner-stickers--left{ margin-right:32px; }
.eu-pg2__banner-stickers--right{ margin-left:32px; }

.eu-pg2__banner-sticker{
  width:var(--s,60px);
  height:var(--s,60px);
  object-fit:contain;
  transform:rotate(var(--r,0deg)) translateY(var(--t,0px));
  flex-shrink:0;
}

/* ═══════════════════════════════════════════════════════════════════════
   FLOATING PANELS DESK — postcard centred, independent panels around it
   ═══════════════════════════════════════════════════════════════════════ */
.eu-pg2__desk{
  display:flex;
  flex-direction:row;
  align-items:flex-start;
  gap:16px;
  padding:24px 20px;
  background:#fff;
  min-height:100vh;
  max-width:1280px;
  margin:40px auto 0;
}
.eu-pg2__desk[hidden]{display:none}

.eu-pg2__desk-left{
  flex-shrink:0;
  width:260px;
  display:flex;
  flex-direction:column;
  gap:12px;
}

.eu-pg2__desk-center{
  flex:1;
  min-width:0;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:16px;
}

.eu-pg2__desk-right{
  flex-shrink:0;
  width:240px;
  display:flex;
  flex-direction:column;
  gap:12px;
}

/* ─── PANEL — borderless, built into the page ───────────────────────── */
.eu-pg2__panel{
  background:transparent;
  display:flex;
  flex-direction:column;
  flex-shrink:0;
}

/* Panel nameplate strip */
.eu-pg2__panel-nameplate{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  padding:0 4px;
  height:28px;
  background:transparent;
  flex-shrink:0;
  margin-bottom:6px;
}

/* Panel name text */
.eu-pg2__panel-name{
  font-family:'Stars Revenge',Arial,sans-serif;
  font-size:13px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;
  color:#2835D0;white-space:nowrap;
}

/* Sublabel inside panel body (Format, Display) */
.eu-pg2__panel-sublabel{
  font-family:'Stars Revenge',Arial,sans-serif;
  font-size:8px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;
  color:#aaa;margin:6px 0 4px;
}

/* Panel body */
.eu-pg2__panel-body{
  padding:0 2px;
  display:flex;
  flex-direction:column;
  gap:8px;
  flex:1;
}

/* Pastry + Stickers panels — fill the left column */
.eu-pg2__panel--pastry,
.eu-pg2__panel--stickers{ width:100%; }
.eu-pg2__panel--pastry .eu-pg2__panel-body,
.eu-pg2__panel--stickers .eu-pg2__panel-body{ gap:10px; }

/* Push panel — centred switch */
.eu-pg2__panel-body--push{
  align-items:center;
  justify-content:center;
  padding:14px 10px;
  gap:0;
}

/* Motion panel — 3×2 grid in left column */
.eu-pg2__panel--motion{ width:100%; }

/* Send panel */
.eu-pg2__panel-body--send{ gap:8px; }

/* Sent counter in send panel nameplate */
.eu-pg2__window-counter{
  display:inline-flex;align-items:baseline;gap:5px;
  font-family:'Stars Revenge',Arial,sans-serif;
  font-size:9px;letter-spacing:.18em;text-transform:uppercase;
  color:#fff;white-space:nowrap;
}
.eu-pg2__window-counter-num{
  font-family:'Times Eighteen',Georgia,serif;
  font-weight:bold;font-size:17px;letter-spacing:.005em;
  font-variant-numeric:tabular-nums;color:#fff;
}

/* ─── CANVAS — postcard on the desk surface ──────────────────────────── */
.eu-pg2__canvas{
  display:flex;
  align-items:center;
  justify-content:center;
  position:relative;
}


/* ═══════════════════════════════════════════════════════════════════════
   APP LAYOUT — two-column grid inside the window body.
   Left: postcard canvas (flexible). Right: controls (fixed 300px).
   ═══════════════════════════════════════════════════════════════════════ */
.eu-pg2__app{
  display:grid;
  grid-template-columns:1fr 300px;
  align-items:stretch;
}

/* ─── CANVAS COLUMN ──────────────────────────────────────────────────── */
.eu-pg2__canvas-col{
  background:#fff;
  border-right:1.5px solid #1a1a1a;
  padding:44px 44px 44px 96px; /* left: extra room for lightswitch */
  display:flex;
  align-items:center;
  justify-content:center;
}
.eu-pg2__stage{
  position:relative;
  width:min(560px,calc(100vw - 560px));
}
.eu-pg2__framed{
  position:relative;
  width:100%;
  aspect-ratio:1063/1270;
}
.eu-pg2__frame{
  position:absolute;inset:0;width:100%;height:100%;
  object-fit:fill;pointer-events:none;z-index:0;
}
.eu-pg2__photo{
  position:absolute;
  top:49.4%;left:48.7%;
  transform:translate(-50%,-50%);
  width:82%;
  aspect-ratio:1080/1350;
  overflow:hidden;
  background:#fff;
  z-index:1;
  container-type:inline-size;
}

/* ─── CONTROLS STRIP — horizontal instrument panel ──────────────────── */
.eu-pg2__controls-col{
  background:#fff;
  display:flex;
  flex-direction:row;
  align-items:stretch;
  overflow-x:auto;
  overflow-y:hidden;
}

/* ─── CONTROL SECTIONS — individual modules ─────────────────────────── */
.eu-pg2__ctrl-section{
  padding:12px 16px 14px;
  flex-shrink:0;
  border-right:1.5px solid #1a1a1a;
  display:flex;
  flex-direction:column;
  gap:8px;
}
.eu-pg2__ctrl-section + .eu-pg2__ctrl-section{
  border-top:none;
}
.eu-pg2__ctrl-section--actions{
  display:flex;
  flex-direction:column;
  gap:8px;
  margin-left:auto;
  border-right:none;
  min-width:160px;
  justify-content:center;
}

/* Section heading row: label left, sub-tabs right */
.eu-pg2__ctrl-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  margin-bottom:10px;
}

/* Primary section label */
.eu-pg2__ctrl-label{
  font-family:'Stars Revenge',Arial,sans-serif;
  font-size:9px;font-weight:700;letter-spacing:.22em;text-transform:uppercase;
  color:#1a1a1a;
  display:block;
  margin-bottom:9px;
}
.eu-pg2__ctrl-head .eu-pg2__ctrl-label{
  margin-bottom:0;
}

/* Smaller inline label (SIZE, Front, Format…) */
.eu-pg2__ctrl-sub-label{
  font-family:'Stars Revenge',Arial,sans-serif;
  font-size:8px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;
  color:#aaa;
  flex:0 0 auto;
}

/* Pair row: two side-by-side items */
.eu-pg2__ctrl-pair-row{
  display:flex;
  gap:12px;
  align-items:flex-start;
}
.eu-pg2__ctrl-pair-item{
  flex:0 0 auto;
  display:flex;
  flex-direction:column;
  gap:7px;
  min-width:80px;
}

/* Size row: SIZE label + halftone slider + readout */
.eu-pg2__size-row{
  display:flex;
  align-items:center;
  gap:8px;
  margin-top:10px;
}

/* ═══════════════════════════════════════════════════════════════════════
   CELL GRID — stamp/motion/tool tiles
   ═══════════════════════════════════════════════════════════════════════ */
.eu-pg2__cell-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(62px,1fr));
  gap:5px;
}
/* Stamp grid: 3 columns — minmax(0,1fr) prevents min-content inflation from food photos */
.eu-pg2__cell-grid--stamps{ grid-template-columns:repeat(3,minmax(0,1fr)); }
/* Front picker: 2 cells side by side */
.eu-pg2__cell-grid--front{  grid-template-columns:repeat(2,1fr); }
/* Motion: 3 per row in the left column */
.eu-pg2__cell-grid--motion{ grid-template-columns:repeat(3,1fr); }
/* Draw tools: 2×2 in the narrower right module */
.eu-pg2__cell-grid--tools{  grid-template-columns:repeat(2,1fr); }

.eu-pg2__cell{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:3px;
  padding:6px 3px 5px;
  background:#fff;
  border:1.5px solid #e0e0e0;
  border-radius:1px;
  cursor:var(--eu-cursor);
  color:#1a1a1a;
  aspect-ratio:1;
  min-height:0;
  min-width:0;
  overflow:hidden;
  user-select:none;
}
.eu-pg2__cell--motion{ aspect-ratio:auto;padding:8px 6px; }
.eu-pg2__cell.is-active{
  background:#2835D0;border-color:#2835D0;color:#fff;
}
.eu-pg2__cell-img{
  width:62%;aspect-ratio:1;
  display:flex;align-items:center;justify-content:center;
  overflow:hidden;flex:0 0 auto;
}
.eu-pg2__cell-img img{
  width:100%;height:100%;object-fit:contain;
  pointer-events:none;-webkit-user-drag:none;
}
.eu-pg2__cell-img--eu img{ width:150%;height:150%; }
.eu-pg2__cell-img--photo{ border-radius:2px;overflow:hidden; }
.eu-pg2__cell-img--photo img{ object-fit:cover; }
.eu-pg2__cell-img--glyph{ font-size:20px;width:auto;aspect-ratio:auto; }
.eu-pg2__cell-img--swatch{
  width:62%;aspect-ratio:1;
  position:relative;border-radius:1px;overflow:hidden;
  display:flex;align-items:center;justify-content:center;
}
.eu-pg2__bg-swatch{
  width:72%;aspect-ratio:1;border-radius:50%;
  background:#fff;box-shadow:inset 0 2px 6px rgba(0,0,0,.1);
}
input[type=color]{
  position:absolute;inset:0;width:100%;height:100%;
  opacity:0;border:none;cursor:var(--eu-cursor);
}
.eu-pg2__cell-label{
  font-family:'Stars Revenge',Arial,sans-serif;
  font-size:7px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;
  text-align:center;
  line-height:1.2;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
  max-width:100%;
}
.eu-pg2__panel--pastry .eu-pg2__cell-label,
.eu-pg2__panel--stickers .eu-pg2__cell-label{ display:none; }

/* ── Pile layout: pastry + sticker cells ─────────────────────────────── */
/* Container: fixed-height relative block — no grid */
.eu-pg2__panel--pastry .eu-pg2__cell-grid,
.eu-pg2__panel--stickers .eu-pg2__cell-grid{
  display:block;
  position:relative;
  height:340px;
}
/* Each cell: absolutely placed, no box chrome */
.eu-pg2__panel--pastry .eu-pg2__cell,
.eu-pg2__panel--stickers .eu-pg2__cell{
  background:transparent;
  border:none;
  border-radius:0;
  padding:0;
  position:absolute;
  width:80px;
  height:80px;
  top:var(--top,0px);
  left:var(--left,0px);
  overflow:visible;
  z-index:1;
}
.eu-pg2__panel--pastry .eu-pg2__cell.is-active,
.eu-pg2__panel--stickers .eu-pg2__cell.is-active{
  background:transparent;border:none;color:inherit;
  z-index:3;
}
/* All full opacity */
.eu-pg2__panel--pastry .eu-pg2__cell:not(.is-active),
.eu-pg2__panel--stickers .eu-pg2__cell:not(.is-active){ opacity:1; }
/* Image: rotate only — absolute pos handles placement */
.eu-pg2__panel--pastry .eu-pg2__cell .eu-pg2__cell-img,
.eu-pg2__panel--stickers .eu-pg2__cell .eu-pg2__cell-img{
  pointer-events:none;
  width:92%;
  transform:rotate(var(--tilt,0deg));
}
/* Active: scale up + drop shadow */
.eu-pg2__panel--pastry .eu-pg2__cell.is-active .eu-pg2__cell-img,
.eu-pg2__panel--stickers .eu-pg2__cell.is-active .eu-pg2__cell-img{
  transform:rotate(var(--tilt,0deg)) scale(1.22);
  filter:drop-shadow(0 4px 8px rgba(0,0,0,0.28));
}

/* Per-item: scattered pile — fits within 260px column */
.eu-pg2__panel--pastry .eu-pg2__cell:nth-child(1),
.eu-pg2__panel--stickers .eu-pg2__cell:nth-child(1){ --tilt:-6deg;  --top:5px;   --left:8px;   }
.eu-pg2__panel--pastry .eu-pg2__cell:nth-child(2),
.eu-pg2__panel--stickers .eu-pg2__cell:nth-child(2){ --tilt:8deg;   --top:18px;  --left:100px; }
.eu-pg2__panel--pastry .eu-pg2__cell:nth-child(3),
.eu-pg2__panel--stickers .eu-pg2__cell:nth-child(3){ --tilt:-4deg;  --top:0px;   --left:168px; }
.eu-pg2__panel--pastry .eu-pg2__cell:nth-child(4),
.eu-pg2__panel--stickers .eu-pg2__cell:nth-child(4){ --tilt:11deg;  --top:110px; --left:58px;  }
.eu-pg2__panel--pastry .eu-pg2__cell:nth-child(5),
.eu-pg2__panel--stickers .eu-pg2__cell:nth-child(5){ --tilt:-9deg;  --top:95px;  --left:165px; }
.eu-pg2__panel--pastry .eu-pg2__cell:nth-child(6),
.eu-pg2__panel--stickers .eu-pg2__cell:nth-child(6){ --tilt:5deg;   --top:130px; --left:10px;  }
.eu-pg2__panel--pastry .eu-pg2__cell:nth-child(7),
.eu-pg2__panel--stickers .eu-pg2__cell:nth-child(7){ --tilt:-7deg;  --top:228px; --left:85px;  }
.eu-pg2__panel--pastry .eu-pg2__cell:nth-child(8),
.eu-pg2__panel--stickers .eu-pg2__cell:nth-child(8){ --tilt:3deg;   --top:240px; --left:5px;   }
.eu-pg2__panel--pastry .eu-pg2__cell:nth-child(9),
.eu-pg2__panel--stickers .eu-pg2__cell:nth-child(9){ --tilt:-11deg; --top:248px; --left:162px; }

/* Baguette + Stroopwafel: 20% smaller */
.eu-pg2__panel--pastry [data-sticker="0"] .eu-pg2__cell-img,
.eu-pg2__panel--pastry [data-sticker="1"] .eu-pg2__cell-img{ width:69%; }
.eu-pg2__panel--pastry [data-sticker="0"].is-active .eu-pg2__cell-img,
.eu-pg2__panel--pastry [data-sticker="1"].is-active .eu-pg2__cell-img{
  transform:rotate(var(--tilt,0deg)) scale(1.22);
  filter:drop-shadow(0 4px 8px rgba(0,0,0,0.28));
  width:69%;
}
.eu-pg2__cell svg{
  width:52%;height:52%;display:block;
}


/* ═══════════════════════════════════════════════════════════════════════
   TAGLINE INPUT — big, bold, campaigns-voice
   ═══════════════════════════════════════════════════════════════════════ */
.eu-pg2__tagline-input{
  width:100%;
  background:#fff;
  border:1.5px solid #e0e0e0;
  border-radius:1px;
  padding:10px 12px;
  font-family:'Times Eighteen',Georgia,serif;
  font-weight:bold;
  font-size:16px;letter-spacing:.005em;
  color:#1a1a1a;outline:none;
  cursor:var(--eu-cursor);
  box-sizing:border-box;
}
.eu-pg2__tagline-input:focus{ border-color:#2835D0;color:#2835D0; }
.eu-pg2__tagline-input::placeholder{
  font-weight:400;font-style:italic;color:#ccc;
}

/* ═══════════════════════════════════════════════════════════════════════
   FORMAT / DISPLAY / CURSOR TOGGLES
   ═══════════════════════════════════════════════════════════════════════ */
.eu-pg2__toggle-row{ display:flex;gap:4px; }
.eu-pg2__toggle-row--stacked{ flex-direction:column;gap:4px; }
.eu-pg2__toggle{
  flex:1;
  font-family:'Stars Revenge',Arial,sans-serif;
  font-size:8px;letter-spacing:.12em;text-transform:uppercase;
  padding:6px 8px;
  border:1.5px solid #e0e0e0;border-radius:1px;
  background:#fff;cursor:var(--eu-cursor);color:#1a1a1a;
  text-align:center;
  white-space:nowrap;
}
.eu-pg2__toggle.is-active{
  background:#1a1a1a;border-color:#1a1a1a;color:#fdfaf4;
}

/* ═══════════════════════════════════════════════════════════════════════
   APPROVE CHIP
   ═══════════════════════════════════════════════════════════════════════ */
.eu-pg2__chip{
  display:inline-flex;align-items:center;gap:8px;
  font-family:'Stars Revenge',Arial,sans-serif;
  font-size:9px;letter-spacing:.16em;text-transform:uppercase;
  color:#1a1a1a;cursor:var(--eu-cursor);user-select:none;
}
.eu-pg2__chip input{ position:absolute;opacity:0;pointer-events:none; }
.eu-pg2__chip-mark{
  display:inline-flex;align-items:center;justify-content:center;
  width:16px;height:16px;
  border:1.5px solid #1a1a1a;
  font-size:12px;color:#1a1a1a;background:#fff;
  flex:0 0 auto;
}
.eu-pg2__chip.is-checked .eu-pg2__chip-mark{
  background:#2835D0;border-color:#2835D0;color:#fff;
}

/* ═══════════════════════════════════════════════════════════════════════
   ACTION BUTTONS — full-width, tall, campaign-blue and red
   ═══════════════════════════════════════════════════════════════════════ */
.eu-pg2__action-btn{
  width:100%;
  height:44px;
  border:none;
  font-family:'Stars Revenge',Arial,sans-serif;
  font-size:9px;font-weight:700;letter-spacing:.22em;text-transform:uppercase;
  cursor:var(--eu-cursor);color:#fff;
  border-radius:1px;
  white-space:nowrap;
}
.eu-pg2__action-btn--send{ background:#2835D0; }
.eu-pg2__action-btn--save{ background:#CC0000; }
.eu-pg2__action-btn.is-disabled{
  background:#e8e8e8;color:#bbb;pointer-events:none;
}
.eu-pg2__action-btn.is-busy{ opacity:.7;pointer-events:none; }

/* ═══════════════════════════════════════════════════════════════════════
   HALFTONE SIZE SLIDER
   ═══════════════════════════════════════════════════════════════════════ */
.eu-pg2__halftone-slider{
  position:relative;
  flex:1;
  height:20px;
  display:flex;align-items:center;
}
.eu-pg2__size-slider{
  position:absolute;inset:0;
  width:100%;
  -webkit-appearance:none;appearance:none;
  background:transparent;outline:none;
  cursor:var(--eu-cursor);
  z-index:2;
  height:100%;
  margin:0;
}
.eu-pg2__size-slider::-webkit-slider-thumb{
  -webkit-appearance:none;
  width:16px;height:16px;
  border-radius:50%;
  background:#fff;
  border:2px solid #1a1a1a;
  cursor:var(--eu-cursor);
}
.eu-pg2__size-slider::-moz-range-thumb{
  width:13px;height:13px;
  border-radius:50%;
  border:2px solid #1a1a1a;
  background:#fff;
  cursor:var(--eu-cursor);
}
.eu-pg2__halftone-track{
  position:absolute;
  left:0;right:0;
  top:50%;transform:translateY(-50%);
  height:9px;
  background:
    radial-gradient(circle,#ccc 36%,transparent 36%) 0 0 / 6px 6px;
  pointer-events:none;
  z-index:1;
  border-radius:1px;
  overflow:hidden;
}
.eu-pg2__halftone-fill{
  position:absolute;
  inset:0 auto 0 0;
  width:50%;
  background:
    radial-gradient(circle,#2835D0 36%,transparent 36%) 0 0 / 6px 6px;
}

/* ═══════════════════════════════════════════════════════════════════════
   TICKER — campaign manifesto strip at the base of the window
   ═══════════════════════════════════════════════════════════════════════ */
.eu-pg2__ticker{
  border-top:1.5px solid #1a1a1a;
  padding:clamp(9px,1.2vw,13px) 16px;
  display:flex;align-items:baseline;gap:12px;
  font-family:'Stars Revenge',Arial,sans-serif;
  font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:#1a1a1a;
  overflow:hidden;
  background:#fff;
}
.eu-pg2__ticker-mark{ color:#2835D0;font-size:12px;flex:0 0 auto; }
.eu-pg2__ticker-line{ white-space:nowrap;flex:1;overflow:hidden;text-overflow:ellipsis; }

/* ═══════════════════════════════════════════════════════════════════════
   POSTCARD CANVAS — background, items, tagline overlay
   ═══════════════════════════════════════════════════════════════════════ */
.eu-pg2__bg{
  position:absolute;inset:0;
  background-size:cover;background-position:center;background-color:#fff;
}
.eu-pg2__items{
  position:absolute;inset:0;z-index:2;
}
.eu-pg2__overlay-tagline{
  position:absolute;
  left:0;right:0;bottom:6%;z-index:3;
  pointer-events:none;
  font-family:'Times Eighteen',Georgia,serif;
  font-weight:bold;
  font-size:clamp(16px,5cqw,42px);
  line-height:1;letter-spacing:-.005em;
  text-align:center;color:#fff;
  text-shadow:0 1px 4px rgba(0,0,0,.5),0 0 1px rgba(0,0,0,.6);
  white-space:pre-line;padding:0 6%;
}

/* ─── STICKER ITEMS ─────────────────────────────────────────────────── */
.eu-pg2__item{
  position:absolute;
  width:30%;aspect-ratio:1;
  cursor:default;touch-action:none;
  transform-origin:center center;
  transform:translate(-50%,-50%);
  user-select:none;-webkit-user-drag:none;
}
.eu-pg2__item-anim{ width:100%;height:100%;display:block; }
.eu-pg2__item img{
  width:100%;height:100%;object-fit:contain;
  pointer-events:none;-webkit-user-drag:none;
}

/* ─── STICKER ANIMATIONS ─────────────────────────────────────────────────
   Sinusoidal motion to match the drawing module (canvas Math.sin loop).
   Multi-step keyframes approximate sin curve; `linear` timing keeps it
   smooth instead of doubling up easing. */
.eu-pg2__items.is-anim-bounce .eu-pg2__item:not(.is-treat) .eu-pg2__item-anim{ animation:euPg2Bounce 1.6s linear infinite; }
.eu-pg2__items.is-anim-beat   .eu-pg2__item:not(.is-treat) .eu-pg2__item-anim{ animation:euPg2Beat   1.25s linear infinite; }
.eu-pg2__items.is-anim-rotate .eu-pg2__item:not(.is-treat) .eu-pg2__item-anim{ animation:euPg2Spin   2.4s linear infinite; }
.eu-pg2__items.is-anim-wiggle .eu-pg2__item:not(.is-treat) .eu-pg2__item-anim{ animation:euPg2Wiggle 0.55s linear infinite; }
.eu-pg2__items.is-anim-orbit  .eu-pg2__item:not(.is-treat) .eu-pg2__item-anim{ animation:euPg2Orbit  2.8s linear infinite; }
.eu-pg2__items[class*="is-anim-"] .eu-pg2__item:not(.is-treat) .eu-pg2__item-anim{ animation-delay:calc(var(--i,0) * -0.13s); }

@keyframes euPg2Bounce{
  0%   {transform:translateY(0)}
  12.5%{transform:translateY(-21%)}
  25%  {transform:translateY(-30%)}
  37.5%{transform:translateY(-21%)}
  50%  {transform:translateY(0)}
  62.5%{transform:translateY(21%)}
  75%  {transform:translateY(30%)}
  87.5%{transform:translateY(21%)}
  100% {transform:translateY(0)}
}
@keyframes euPg2Beat{
  0%   {transform:scale(1)}
  12.5%{transform:scale(1.18)}
  25%  {transform:scale(1.25)}
  37.5%{transform:scale(1.18)}
  50%  {transform:scale(1)}
  62.5%{transform:scale(0.82)}
  75%  {transform:scale(0.75)}
  87.5%{transform:scale(0.82)}
  100% {transform:scale(1)}
}
@keyframes euPg2Spin{
  from{transform:rotate(0deg)}
  to  {transform:rotate(360deg)}
}
@keyframes euPg2Wiggle{
  0%   {transform:rotate(-15deg)}
  50%  {transform:rotate(15deg)}
  100% {transform:rotate(-15deg)}
}
@keyframes euPg2Orbit{
  0%   {transform:translate(8%,0) rotate(0deg)}
  12.5%{transform:translate(5.7%,-5.7%) rotate(45deg)}
  25%  {transform:translate(0,-8%) rotate(90deg)}
  37.5%{transform:translate(-5.7%,-5.7%) rotate(135deg)}
  50%  {transform:translate(-8%,0) rotate(180deg)}
  62.5%{transform:translate(-5.7%,5.7%) rotate(225deg)}
  75%  {transform:translate(0,8%) rotate(270deg)}
  87.5%{transform:translate(5.7%,5.7%) rotate(315deg)}
  100% {transform:translate(8%,0) rotate(360deg)}
}

/* Invert display mode */
.eu-pg2__photo.is-inverted{ filter:invert(1); }

/* ═══════════════════════════════════════════════════════════════════════
   LIGHTSWITCH — physical wall switch, to the left of the postcard.
   ═══════════════════════════════════════════════════════════════════════ */
.eu-pg2__switch-mount{
  position:absolute;
  left:-80px;
  top:50%;
  transform:translateY(-50%);
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:10px;
  z-index:10;
}
.eu-pg2__switch-wrap{ width:99px;height:153px;position:relative;cursor:var(--eu-cursor);user-select:none; }
.eu-pg2__switch-wrap .eu-pg2__switch-input{position:absolute;opacity:0;pointer-events:none}
.eu-pg2__switch-wrap .panel{
  transform:scale(0.364);transform-origin:left top;
  background-color:#fff;border-radius:1px;
  box-shadow:
    inset -4px -4px 8px rgba(0,0,0,.25),
    inset 4px 4px 8px rgba(255,255,255,.5),
    inset 2px 2px 2px rgba(177,177,177,.25),
    -4px -4px 16px rgba(255,255,255,.25),
    1px 1px 1px rgba(0,0,0,.1),
    4px 4px 2px rgba(0,0,0,.05),
    6px 6px 3px rgba(0,0,0,.05);
  height:420px;width:270px;position:relative;
}
.eu-pg2__switch-wrap .screw{
  align-items:center;background-color:#fff;border:1px solid #eee;border-radius:100%;
  box-shadow:inset -3px -3px 6px rgba(0,0,0,.1),inset 0 0 2px rgba(0,0,0,.2);
  display:flex;height:24px;justify-content:center;position:absolute;
  left:50%;transform:translateX(-50%);width:24px;
}
.eu-pg2__switch-wrap .screw.top{top:24px}
.eu-pg2__switch-wrap .screw.top .screw__slot{transform:rotate(10deg)}
.eu-pg2__switch-wrap .screw.bottom{bottom:24px}
.eu-pg2__switch-wrap .screw.bottom .screw__slot{transform:rotate(-30deg)}
.eu-pg2__switch-wrap .screw__slot{
  background-color:#eee;border-radius:2px;box-shadow:inset 2px 2px 4px rgba(0,0,0,.2);
  height:4px;width:calc(100% - 2px);
}
.eu-pg2__switch-wrap .switch__hole{
  background-color:#bbb;border-radius:6px;height:240px;left:50%;padding:2px;
  position:absolute;top:50%;transform:translateX(-50%) translateY(-50%);width:120px;
}
.eu-pg2__switch-wrap .switch__groove{
  background-color:#f7f7f7;border-radius:5px;
  box-shadow:inset 1px 1px 2px rgba(0,0,0,.2),inset -1px -1px 4px rgba(0,0,0,.2),-1px -1px 4px rgba(255,255,255,.5);
  padding:5px;height:100%;width:100%;
}
.eu-pg2__switch-wrap .switch{
  background-color:#fff;border-radius:1px;border:1px solid #ddd;
  box-shadow:0 0 2px rgba(0,0,0,.75),-2px -2px 2px rgba(255,255,255,.75);
  cursor:var(--eu-cursor);position:relative;height:100%;width:100%;
}
.eu-pg2__switch-wrap .switch__top{
  background-color:#eee;
  box-shadow:inset 0 0 6px rgba(0,0,0,.05),inset 0 0 24px rgba(0,0,0,.025),inset -16px -16px 36px rgba(0,0,0,.1);
  height:50%;left:0;position:absolute;top:0;width:100%;z-index:2;
}
.eu-pg2__switch-wrap .switch__top-outset{ background:linear-gradient(90deg,#fff,#f7f7f7);height:10px; }
.eu-pg2__switch-wrap .switch__bottom{
  background-color:#fff;
  box-shadow:inset 0 0 3px rgba(0,0,0,.1),inset 0 0 12px rgba(0,0,0,.05);
  height:50%;left:0;position:absolute;top:50%;width:100%;z-index:2;
}
.eu-pg2__switch-wrap .switch__bottom-outset{
  bottom:0;background:linear-gradient(90deg,#e7e7e7,#d7d7d7);
  box-shadow:inset 0 0 3px rgba(0,0,0,.1),inset 0 0 12px rgba(0,0,0,.05);
  height:0;position:absolute;width:100%;
}
.eu-pg2__switch-wrap .switch__shadow-box{
  height:208px;left:104px;overflow:hidden;position:absolute;width:100px;z-index:1;
}
.eu-pg2__switch-wrap .switch__shadow-box.top{top:-96px}
.eu-pg2__switch-wrap .switch__shadow-box.bottom{top:20px}
.eu-pg2__switch-wrap .switch__shadow.top{
  background-color:rgba(0,0,0,.33);height:90px;position:absolute;
  bottom:20px;filter:blur(10px);left:-70px;opacity:1;transform:rotate(20deg);width:90px;
}
.eu-pg2__switch-wrap .switch__shadow.bottom{
  background-color:rgba(0,0,0,.33);height:90px;position:absolute;
  bottom:0;left:-90px;filter:blur(0);opacity:.5;transform:rotate(0deg);width:90px;
}
.eu-pg2__switch-wrap .eu-pg2__switch-input:checked + .panel .switch__top{
  background-color:#fff;box-shadow:inset 0 0 3px rgba(0,0,0,.1),inset 0 0 12px rgba(0,0,0,.05);
}
.eu-pg2__switch-wrap .eu-pg2__switch-input:checked + .panel .switch__top-outset{height:0}
.eu-pg2__switch-wrap .eu-pg2__switch-input:checked + .panel .switch__bottom{background-color:#eee}
.eu-pg2__switch-wrap .eu-pg2__switch-input:checked + .panel .switch__bottom-outset{height:10px}
.eu-pg2__switch-wrap .eu-pg2__switch-input:checked + .panel .switch__shadow.top{
  left:-90px;filter:blur(0);opacity:.5;transform:rotate(0deg);
}
.eu-pg2__switch-wrap .eu-pg2__switch-input:checked + .panel .switch__shadow.bottom{
  left:-70px;filter:blur(10px);opacity:1;transform:rotate(-20deg);
}
.eu-pg2__switch-label{
  font-family:'ABC Schengen Mono','Courier New',ui-monospace,monospace;
  font-style:normal;font-size:11px;
  white-space:nowrap;color:#bbb;
  letter-spacing:.01em;text-align:center;
}

/* ═══════════════════════════════════════════════════════════════════════
   BG IMAGE MODAL
   ═══════════════════════════════════════════════════════════════════════ */
.eu-pg2__bg-modal{
  position:fixed;inset:0;z-index:9999;
  display:flex;align-items:center;justify-content:center;padding:24px;
}
.eu-pg2__bg-modal[hidden]{display:none}
.eu-pg2__bg-modal-backdrop{
  position:absolute;inset:0;
  background:rgba(0,0,0,.5);cursor:var(--eu-cursor);
}
.eu-pg2__bg-modal-panel{
  position:relative;background:#fff;border-radius:1px;
  width:min(700px,100%);max-height:85vh;overflow:auto;
  padding:24px 24px 28px;
  border:1.5px solid #1a1a1a;
  box-shadow:5px 5px 0 rgba(0,0,0,.05),0 16px 44px rgba(0,0,0,.18);
}
.eu-pg2__bg-modal-close{
  position:absolute;top:12px;right:14px;
  background:none;border:none;font-size:28px;line-height:1;
  cursor:var(--eu-cursor);color:#1a1a1a;
}
.eu-pg2__bg-modal-title{
  font-family:'Stars Revenge',Arial,sans-serif;
  font-size:11px;letter-spacing:.32em;text-transform:uppercase;
  margin-bottom:16px;color:#1a1a1a;
}
.eu-pg2__bg-source{
  display:grid;grid-template-columns:repeat(auto-fill,minmax(110px,1fr));gap:8px;
}
.eu-pg2__bg-source-item{
  aspect-ratio:1;overflow:hidden;cursor:var(--eu-cursor);
  border:2px solid transparent;
}
.eu-pg2__bg-source-item:hover{ border-color:#CC0000; }
.eu-pg2__bg-source-item img{
  width:100%;height:100%;object-fit:cover;
  pointer-events:none;-webkit-user-drag:none;
}

/* ═══════════════════════════════════════════════════════════════════════
   RESPONSIVE
   ═══════════════════════════════════════════════════════════════════════ */
@media(max-width:500px){
  .eu-pg2__canvas{
    padding:20px 20px 20px 72px;
  }
  .eu-pg2__stage{
    width:calc(100vw - 120px);
  }
  .eu-pg2__switch-mount{
    left:-60px;
  }
}

/* ═══════════════════════════════════════════════════════════════════════
   APERITIVO + GOLDEN HOUR ACCENTS
   ═══════════════════════════════════════════════════════════════════════ */
.eu-os-body.is-aperitivo .eu-pg2__ticker-mark{ color:#d35400; }
.eu-os-body.is-aperitivo .eu-pg2__action-btn--send{ background:#2835D0; }
.eu-os-body.is-golden .eu-pg2__action-btn--send{ background:#2835D0; }
.eu-os-body.is-golden .eu-pg2__action-btn--save{ background:#CC0000; }
.eu-os-body.is-golden .eu-pg2__cell--sticker.is-active{ border-color:#b08600; }

/* ═══════════════════════════════════════════════════════════════════════
   v2 REDESIGN OVERRIDES
   Marquee → tagline → big serif headline → subhead → 3-col workspace.
   Light switch top-left, combined pencil pile, size slider with pastry token.
   3×2 animate pills, bg row, 2×2 tools, full-width send/save.
   ═══════════════════════════════════════════════════════════════════════ */

.eu-os-body{ background:#fff; }
.eu-os{ background:#fff; }

/* Marquee — taller, mixed text + pastry images, scrolling */
.eu-pg2__campaign-banner{ background:transparent; }
.eu-pg2__banner-ticker-wrap{
  background:transparent;
  height:38px;
  border-bottom:none;
}
.eu-pg2__banner-ticker-track{
  gap:6px;
  padding-left:32px;
  animation:euMarqueeScroll 50s linear infinite;
}
.eu-pg2__banner-ticker-seg{
  font-family:'Times Eighteen',Georgia,'Times New Roman',serif;
  font-style:normal;
  font-weight:700;
  font-size:22px;
  letter-spacing:.04em;
  text-transform:uppercase;
  color:#111;
}
.eu-pg2__banner-ticker-pastry{
  height:44px;
  width:auto;
  flex-shrink:0;
  object-fit:contain;
}
@keyframes euMarqueeScroll{
  from{ transform:translateX(0); }
  to{ transform:translateX(-50%); }
}

/* Hide old banner-body / side-stickers in case they linger */
.eu-pg2__banner-body{ display:none !important; }

/* INTRO block — tagline + huge headline + subhead */
.eu-pg2__intro{
  text-align:center;
  padding:32px 24px 28px;
  max-width:1280px;
  margin:0 auto;
}
.eu-pg2__intro-tagline{
  font-family:'Arial Black','Helvetica Neue',Helvetica,Arial,sans-serif;
  font-weight:900;
  font-size:18px;
  letter-spacing:-.02em;
  text-transform:uppercase;
  color:#2835D0;
  margin:0 0 28px;
}
.eu-pg2__intro-title{
  margin:0;
  display:flex;
  flex-direction:column;
  align-items:center;
  line-height:.86;
  font-family:'Times Eighteen',Georgia,'Times New Roman',serif;
  font-weight:700;
  color:#0d0d0d;
  text-transform:uppercase;
  letter-spacing:-.02em;
}
.eu-pg2__intro-title-sm{
  font-size:clamp(28px,4.4vw,64px);
  letter-spacing:-.005em;
  white-space:nowrap;
}
.eu-pg2__intro-title-lg{
  font-size:clamp(44px,8.4vw,128px);
  letter-spacing:-.025em;
  margin-top:10px;
  white-space:nowrap;
}
.eu-pg2__intro-subhead{
  font-family:'Times Eighteen',Georgia,'Times New Roman',serif;
  font-style:normal;
  font-weight:700;
  font-size:20px;
  line-height:1.4;
  color:#1a1a1a;
  max-width:760px;
  margin:32px auto 0;
}

/* DESK — 3-col, transparent bg (so cream shows through) */
.eu-pg2__desk{
  background:transparent;
  width:100%;
  max-width:1280px;
  margin:60px auto 0;
  padding:24px 28px 80px;
  gap:92px;
  align-items:flex-start;
  box-sizing:border-box;
  min-height:0;
}
.eu-pg2__desk-left{ width:280px; gap:24px; }
.eu-pg2__desk-right{ width:280px; gap:18px; }

/* PLASTIC PLATE — shared skeuomorphic look matching the lightswitch + slider.
   Wraps the control panels in both columns so they all read as one family. */
.eu-pg2__panel--pencil,
.eu-pg2__desk-right .eu-pg2__panel--motion,
.eu-pg2__desk-right .eu-pg2__panel--bg,
.eu-pg2__desk-right .eu-pg2__panel--draw{
  background:#fff;
  border-radius:1px;
  padding:6px;
  box-sizing:border-box;
  box-shadow:
    inset -2px -2px 4px rgba(0,0,0,.18),
    inset 2px 2px 4px rgba(255,255,255,.5),
    inset 1px 1px 1px rgba(177,177,177,.25),
    1px 1px 1px rgba(0,0,0,.1),
    3px 3px 2px rgba(0,0,0,.05);
}

/* Inside the plates, drop all grid borders. Each cell becomes a plastic
   button — raised at rest, pressed-in when active. */
.eu-pg2__desk-right .eu-pg2__cell-grid--motion,
.eu-pg2__desk-right .eu-pg2__cell-grid--tools,
.eu-pg2__panel--bg .eu-pg2__bg-row{
  border:none;
  gap:6px;
}
.eu-pg2__format-toggle{
  border:none;
  gap:6px;
}

/* Plastic key — floating button, lit from above. Soft diffused shadow,
   no hard edges, matches the lightswitch toggle. */
.eu-pg2__desk-right .eu-pg2__cell--motion,
.eu-pg2__desk-right .eu-pg2__cell--tool,
.eu-pg2__panel--bg .eu-pg2__cell--front,
.eu-pg2__format-btn,
.eu-pg2__panel--pencil .eu-pg2__cell{
  border:none;
  border-radius:1px;
  background:#fff;
  box-shadow:
    0 2px 4px rgba(0,0,0,.10),
    0 1px 1px rgba(0,0,0,.06),
    inset 0 1px 0 rgba(255,255,255,.9),
    inset 0 -1px 2px rgba(0,0,0,.05);
}

/* Plastic key — pressed into the plate. Deep diffused inset shadow,
   no outer drop. */
.eu-pg2__desk-right .eu-pg2__cell--motion.is-active,
.eu-pg2__desk-right .eu-pg2__cell--tool.is-active,
.eu-pg2__panel--bg .eu-pg2__cell--front.is-active,
.eu-pg2__format-btn.is-active,
.eu-pg2__panel--pencil .eu-pg2__cell.is-active{
  background:#f6f6f6;
  box-shadow:
    inset 0 1px 2px rgba(0,0,0,.08),
    inset 0 0 0 1px rgba(0,0,0,.06);
}

/* SHARE NOTE — small body copy above send/save */
.eu-pg2__share-note{
  font-family:'Times Eighteen',Georgia,'Times New Roman',serif;
  font-weight:400;
  font-size:12px;
  line-height:1.4;
  color:#0d0d0d;
  margin:4px 0 8px;
}

/* SECTION HEAD — hidden */
.eu-pg2__section-head{ display:none; }
.eu-pg2__section-rule{
  display:none;
  border:none;
  margin:0;
  height:0;
}

/* PANELS — borderless, no nameplates needed in new layout */
.eu-pg2__panel-nameplate{ display:none; }
.eu-pg2__panel--push{ order:1; margin-top:0; }
.eu-pg2__panel--pencil{ order:2; margin-top:25px; }
.eu-pg2__panel--pencil .eu-pg2__panel-nameplate{
  display:block;
  height:auto;
  margin-bottom:14px;
  text-align:center;
}
.eu-pg2__panel--pencil .eu-pg2__panel-name{
  font-family:'Times Eighteen',Georgia,'Times New Roman',serif;
  font-size:15px;
  font-weight:700;
  letter-spacing:-.01em;
  text-transform:uppercase;
  color:#0d0d0d;
}

/* LIGHT SWITCH PANEL — top of left col, no title, switch centered */
.eu-pg2__panel--push{ width:100%; align-items:stretch; }
.eu-pg2__panel--push .eu-pg2__panel-body--push{
  padding:0;
  align-items:center;
  gap:8px;
  width:100%;
}
.eu-pg2__switch-label{ display:none !important; }

/* PENCIL PILE — pastry+sticker tiles, white circle backdrops, clustered */
#euPg2PastryGrid{
  position:relative;
  width:100%;
  max-width:100%;
  margin:0 auto 16px;
}
.eu-pg2__panel--pencil .eu-pg2__cell-grid--stamps{
  position:static;
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:0;
  width:100%;
  height:auto;
  max-height:500px;
  transform:none;
  margin:0;
  border:none;
}
.eu-pg2__panel--pencil .eu-pg2__cell{
  position:static;
  width:auto;
  height:auto;
  aspect-ratio:1/1;
  transform:none;
  padding:6px;
}
.eu-pg2__panel--pencil .eu-pg2__cell-grid--stamps{ gap:6px; padding:0; }
.eu-pg2__panel--pencil .eu-pg2__cell-grid--stamps .eu-pg2__cell{
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:center;
}
.eu-pg2__panel--pencil .eu-pg2__cell-img{
  width:88%;
  height:88%;
  display:flex;
  align-items:center;
  justify-content:center;
}
.eu-pg2__panel--pencil .eu-pg2__cell-img img{
  max-width:100%;
  max-height:100%;
  object-fit:contain;
}
.eu-pg2__panel--pencil .eu-pg2__cell-img--eu img{
  max-width:192%;
  max-height:192%;
  width:192%;
  height:192%;
}
.eu-pg2__panel--pencil .eu-pg2__cell.is-active{
  transform:none;
  filter:none;
}
.eu-pg2__panel--pencil .eu-pg2__cell-label{ display:none; }

/* Cluster positions — spread across a wider pile */
.eu-pg2__panel--pencil .eu-pg2__cell:nth-child(1){  --tilt:-6deg;  --top:0px;    --left:130px; }
.eu-pg2__panel--pencil .eu-pg2__cell:nth-child(2){  --tilt:8deg;   --top:50px;   --left:64px;  }
.eu-pg2__panel--pencil .eu-pg2__cell:nth-child(3){  --tilt:-4deg;  --top:24px;   --left:204px; }
.eu-pg2__panel--pencil .eu-pg2__cell:nth-child(4){  --tilt:6deg;   --top:96px;   --left:148px; }
.eu-pg2__panel--pencil .eu-pg2__cell:nth-child(5){  --tilt:-9deg;  --top:88px;   --left:228px; }
.eu-pg2__panel--pencil .eu-pg2__cell:nth-child(6){  --tilt:5deg;   --top:148px;  --left:84px;  }
.eu-pg2__panel--pencil .eu-pg2__cell:nth-child(7){  --tilt:-7deg;  --top:160px;  --left:192px; }
.eu-pg2__panel--pencil .eu-pg2__cell:nth-child(8){  --tilt:4deg;   --top:212px;  --left:128px; }
.eu-pg2__panel--pencil .eu-pg2__cell:nth-child(9){  --tilt:-12deg; --top:120px;  --left:8px;   }
.eu-pg2__panel--pencil .eu-pg2__cell:nth-child(10){ --tilt:7deg;   --top:208px;  --left:36px;  }
.eu-pg2__panel--pencil .eu-pg2__cell:nth-child(11){ --tilt:-5deg;  --top:236px;  --left:208px; }
.eu-pg2__panel--pencil .eu-pg2__cell:nth-child(12){ --tilt:9deg;   --top:284px;  --left:80px;  }
.eu-pg2__panel--pencil .eu-pg2__cell:nth-child(13){ --tilt:-8deg;  --top:288px;  --left:172px; }
.eu-pg2__panel--pencil .eu-pg2__cell:nth-child(14){ --tilt:6deg;   --top:340px;  --left:120px; }
.eu-pg2__panel--pencil .eu-pg2__cell:nth-child(15){ --tilt:-10deg; --top:268px;  --left:228px; }
.eu-pg2__panel--pencil .eu-pg2__cell:nth-child(16){ --tilt:11deg;  --top:312px;  --left:32px;  }
.eu-pg2__panel--pencil .eu-pg2__cell:nth-child(17){ --tilt:-3deg;  --top:60px;   --left:0px;   }
.eu-pg2__panel--pencil .eu-pg2__cell:nth-child(18){ --tilt:14deg;  --top:344px;  --left:212px; }

/* SIZE SLIDER — pastry token thumb on a track, scales with value */
.eu-pg2__size{
  position:relative;
  width:100%;
  max-width:none;
  height:34px;
  margin:8px auto 0;
  padding:0 8px;
  box-sizing:border-box;
}
.eu-pg2__size-input{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  opacity:0;
  cursor:pointer;
  z-index:3;
  margin:0;
  padding:0;
  -webkit-appearance:none;
  appearance:none;
  background:transparent;
}
.eu-pg2__size-input::-webkit-slider-thumb{
  -webkit-appearance:none;
  width:48px;
  height:48px;
}
.eu-pg2__size-input-mirror{ display:none; }
.eu-pg2__size-track{
  position:absolute;
  left:8px; right:8px;
  top:50%;
  transform:translateY(-50%);
  height:6px;
  background:#f0f0f0;
  border-radius:1px;
  box-shadow:
    inset 1px 1px 2px rgba(0,0,0,.25),
    inset -1px -1px 2px rgba(255,255,255,.6);
  z-index:1;
}
.eu-pg2__size-thumb{
  position:absolute;
  top:50%;
  left:50%;
  transform:translate(-50%,-50%);
  width:22px;
  height:22px;
  border-radius:1px;
  background:linear-gradient(180deg,#fff 0%,#eee 100%);
  border:1px solid #ddd;
  box-shadow:
    inset 0 0 2px rgba(255,255,255,.8),
    0 1px 2px rgba(0,0,0,.4),
    -1px -1px 2px rgba(255,255,255,.6);
  z-index:2;
  pointer-events:none;
}
.eu-pg2__size-thumb img{
  width:100%;
  height:100%;
  object-fit:contain;
}

/* CENTER — postcard stage */
.eu-pg2__desk-center{ gap:0; }
.eu-pg2__stage{ width:100%; max-width:560px; }

/* RIGHT — animate pills 3×2 */
.eu-pg2__panel--motion .eu-pg2__cell-grid--motion{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:6px;
  border:none;
}
.eu-pg2__cell--motion{
  background:transparent;
  border:none;
  border-radius:0;
  padding:14px 6px;
  font-family:'Times Eighteen',Georgia,'Times New Roman',serif;
  font-size:15px;
  font-weight:700;
  letter-spacing:-.01em;
  text-transform:uppercase;
  color:#0d0d0d;
  cursor:pointer;
  text-align:center;
  white-space:nowrap;
  overflow:visible;
}
.eu-pg2__cell--motion .eu-pg2__cell-label{
  display:inline;
  font-family:'Times Eighteen',Georgia,'Times New Roman',serif;
  font-size:15px;
  font-weight:700;
  letter-spacing:-.01em;
  overflow:visible;
  text-overflow:clip;
  max-width:none;
}
.eu-pg2__cell--motion.is-active{
  border:none;
  color:#0d0d0d;
}

/* BG ROW — image tile + colour tile + format toggle */
.eu-pg2__panel--bg .eu-pg2__bg-row{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:6px;
  align-items:stretch;
  border:none;
}
.eu-pg2__panel--bg .eu-pg2__cell--front{
  border:none;
}
.eu-pg2__panel--bg .eu-pg2__cell--front .eu-pg2__cell-img{
  filter:none;
  aspect-ratio:1/1;
}
.eu-pg2__cell--front{
  background:transparent;
  border:none;
  border-radius:0;
  padding:0;
  display:flex;
  flex-direction:column;
  align-items:stretch;
  gap:6px;
  cursor:pointer;
  aspect-ratio:auto;
  height:auto;
}
.eu-pg2__cell--front .eu-pg2__cell-img{
  width:100%;
  aspect-ratio:1/1;
  flex:none;
  border-radius:0;
  overflow:hidden;
  display:flex;
  align-items:center;
  justify-content:center;
  background:#fff;
  min-height:0;
  filter:drop-shadow(0 1px 1px rgba(0,0,0,0.08));
}
.eu-pg2__cell--front .eu-pg2__cell-img--photo img{
  width:100%; height:100%; object-fit:cover;
}
.eu-pg2__cell--front .eu-pg2__cell-img--swatch{
  position:relative;
  overflow:hidden;
  background:#fff;
}
.eu-pg2__cell--front .eu-pg2__bg-swatch{
  position:absolute;
  inset:0;
  width:auto;
  aspect-ratio:auto;
  border-radius:0;
  border:none;
  background:#fff;
}
.eu-pg2__cell--front .eu-pg2__cell-img--swatch::after{
  display:none;
}
.eu-pg2__cell--front.is-active .eu-pg2__cell-img--swatch::after{ display:none; }
@keyframes eu-pg2-bg-flag-switch{
  0%    { background:#0055A4; } /* France blue */
  12.5% { background:#009246; } /* Italy green */
  25%   { background:#DD0000; } /* Germany red */
  37.5% { background:#FAE042; } /* Belgium yellow */
  50%   { background:#21468B; } /* Netherlands blue */
  62.5% { background:#FF883E; } /* Ireland orange */
  75%   { background:#FCD116; } /* Romania yellow */
  87.5% { background:#477050; } /* Hungary green */
}
.eu-pg2__cell--front .eu-pg2__cell-img--swatch input[type="color"]{
  position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer;z-index:2;
}
.eu-pg2__cell--front .eu-pg2__cell-label{ display:none; }
.eu-pg2__cell--front.is-active .eu-pg2__cell-label{ color:#1a1a1a; }
.eu-pg2__cell--front.is-active{
  border-color:#1a1a1a;
}

/* FORMAT toggle — small dark vertical pills */
.eu-pg2__format-toggle{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:6px;
  width:100%;
  border:none;
  margin-top:6px;
}
.eu-pg2__format-btn{
  padding:14px 10px;
  font-family:'Times Eighteen',Georgia,'Times New Roman',serif;
  font-size:15px;
  font-weight:700;
  letter-spacing:-.01em;
  text-transform:uppercase;
  color:#0d0d0d;
  cursor:pointer;
  white-space:nowrap;
  text-align:center;
}
.eu-pg2__format-btn.is-active{ color:#0d0d0d; }

/* TOOLS 2×2 */
.eu-pg2__panel--draw .eu-pg2__cell-grid--tools{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:6px;
  border:none;
}
.eu-pg2__cell--tool{
  background:transparent;
  border:none;
  border-radius:0;
  padding:14px 8px;
  display:flex;
  flex-direction:row;
  align-items:center;
  justify-content:center;
  gap:8px;
  cursor:pointer;
  aspect-ratio:auto;
  height:auto;
}
.eu-pg2__cell--tool .eu-pg2__cell-img{
  display:flex;
  width:22px;
  height:22px;
  align-items:center;
  justify-content:center;
  color:#0d0d0d;
}
.eu-pg2__cell--tool .eu-pg2__cell-img svg{ width:100%; height:100%; }
.eu-pg2__cell--tool .eu-pg2__cell-label{
  font-family:'Times Eighteen',Georgia,'Times New Roman',serif;
  font-size:15px;
  font-weight:700;
  letter-spacing:-.01em;
  text-transform:uppercase;
  color:#0d0d0d;
}
.eu-pg2__cell--tool.is-active{ background:transparent; border:none; }
.eu-pg2__cell--tool.is-active .eu-pg2__cell-img{ color:#0d0d0d; }
.eu-pg2__cell--tool.is-active .eu-pg2__cell-label{ color:#0d0d0d; }

/* SEND + SAVE — full-width buttons */
.eu-pg2__panel--send .eu-pg2__panel-body--send{
  padding:0;
  gap:10px;
}
.eu-pg2__action-btn{
  width:100%;
  height:56px;
  border:none;
  padding:0 20px;
  font-family:'Arial Black','Helvetica Neue',Helvetica,Arial,sans-serif;
  font-size:14px;
  font-weight:900;
  letter-spacing:.04em;
  text-transform:uppercase;
  cursor:pointer;
  border-radius:1px;
  text-align:center;
  line-height:1;
  display:flex;
  align-items:center;
  justify-content:center;
  box-shadow:
    0 2px 4px rgba(0,0,0,.18),
    0 1px 1px rgba(0,0,0,.08),
    inset 0 1px 0 rgba(255,255,255,.35),
    inset 0 -2px 3px rgba(0,0,0,.18);
}
.eu-pg2__action-btn:active{
  box-shadow:
    inset 0 3px 5px rgba(0,0,0,.32),
    inset 0 1px 2px rgba(0,0,0,.22);
}
.eu-pg2__action-btn--send{
  background:#2835D0;
  color:#fff;
}
.eu-pg2__action-btn--save{
  background:#CC0000;
  color:#fff;
}
.eu-pg2__action-btn.is-disabled{ opacity:.45; cursor:not-allowed; }

/* Hide controls strip / boot remnants if rendered */
.eu-pg2__controls-col,
.eu-os__boot,
.eu-os__menubar,
.eu-os__statusbar{ display:none !important; }

/* Force hidden attribute */
[hidden]{ display:none !important; }

/* Responsive — collapse 3-col below 1100px */
@media (max-width:1100px){
  .eu-pg2__desk{ flex-direction:column; align-items:center; gap:24px; }
  .eu-pg2__desk-left,
  .eu-pg2__desk-right{ width:100%; max-width:480px; }
  .eu-pg2__desk-center{ width:100%; max-width:560px; order:0; }
  .eu-pg2__desk-left{ order:1; }
  .eu-pg2__desk-right{ order:2; }
}

@media (max-width:640px){
  /* Compact intro on mobile */
  .eu-pg2__intro{ padding:16px 20px 8px; }
  .eu-pg2__intro-gif{ margin:8px auto 14px; max-width:88%; }
  .eu-pg2__intro-subhead{ font-size:14px; line-height:1.45; margin:12px auto 0; max-width:100%; }
  .eu-pg2__banner-ticker-seg{ font-size:13px; }
  .eu-pg2__banner-ticker-pastry{ height:28px; }
  .eu-pg2__desk{ margin-top:0; padding-top:8px; }

  /* CSS Grid: switch spans 2 rows on the left, 8 buttons fill 2x4 grid */
  .eu-pg2__desk{
    display:grid;
    grid-template-columns:50px 52px 50px 50px 50px 50px 1fr;
    grid-template-rows:50px 50px auto auto auto auto;
    grid-auto-rows:auto;
    grid-auto-flow:row;
    padding:12px 10px 24px 20px;
    column-gap:6px;
    row-gap:10px;
    align-items:stretch;
  }
  /* Toolbar buttons: 50x50 in their grid cell */
  #euPg2BgShow,
  #euPg2BgColor,
  .eu-pg2__format-btn,
  .eu-pg2__cell--tool{
    width:50px;
    height:50px;
    min-width:0;
  }
  .eu-pg2__desk-left,
  .eu-pg2__desk-right{ display:contents; }

  .eu-pg2__panel--push,
  .eu-pg2__panel--bg,
  .eu-pg2__panel--draw{ display:contents; }
  .eu-pg2__panel--push .eu-pg2__panel-body,
  .eu-pg2__panel--bg .eu-pg2__panel-body,
  .eu-pg2__panel--draw .eu-pg2__panel-body{ display:contents; }
  .eu-pg2__panel--bg .eu-pg2__bg-row,
  .eu-pg2__format-toggle,
  .eu-pg2__panel--draw .eu-pg2__cell-grid--tools{ display:contents; }

  /* Hide section headers/rules that would otherwise become stray grid items */
  .eu-pg2__panel--push .eu-pg2__section-head,
  .eu-pg2__panel--push .eu-pg2__section-rule,
  .eu-pg2__panel--bg .eu-pg2__section-head,
  .eu-pg2__panel--bg .eu-pg2__section-rule,
  .eu-pg2__panel--draw .eu-pg2__section-head,
  .eu-pg2__panel--draw .eu-pg2__section-rule{
    display:none;
  }

  /* Switch — column 1, spans rows 1-2 */
  .eu-pg2__switch-wrap{
    grid-column:1;
    grid-row:1 / span 2;
    width:auto;
    height:auto;
    align-self:stretch;
    position:relative;
    margin-left:30px;
  }
  .eu-pg2__switch-wrap .panel{
    transform:scale(0.26); transform-origin:center center;
    position:absolute; top:50%; left:50%;
    margin:-210px 0 0 -135px;
  }
  .eu-pg2__switch-label{ display:none; }

  /* 8 toolbar buttons — explicit grid placement */
  .eu-pg2__panel--bg .eu-pg2__cell--front,
  .eu-pg2__format-btn,
  .eu-pg2__cell--tool{
    width:auto;
    height:auto;
    min-width:0;
    padding:0;
  }
  /* Row 1, cols 3-6 (col 2 is spacer) */
  #euPg2BgShow{ grid-column:3; grid-row:1; }
  #euPg2BgColor{ grid-column:4; grid-row:1; }
  .eu-pg2__format-btn[data-format="feed"]{ grid-column:5; grid-row:1; }
  .eu-pg2__format-btn[data-format="story"]{ grid-column:6; grid-row:1; }
  /* Row 2, cols 3-6 */
  #euPg2Pencil{ grid-column:3; grid-row:2; }
  #euPg2Grab{ grid-column:4; grid-row:2; }
  #euPg2Undo{ grid-column:5; grid-row:2; }
  #euPg2Clear{ grid-column:6; grid-row:2; }

  /* Full-width grid items below the toolbar */
  .eu-pg2__desk-center{ grid-column:1 / -1; grid-row:3; margin-top:10px; }
  .eu-pg2__desk-center .eu-pg2__stage{ max-width:90%; margin:0 auto; }
  .eu-pg2__panel--pencil{ grid-column:1 / -1; grid-row:4; height:auto; }
  .eu-pg2__panel--motion{ grid-column:1 / -1; grid-row:5; height:auto; }
  .eu-pg2__panel--send{ grid-column:1 / -1; grid-row:6; height:auto; }
  /* Image + colour swatches — fill the entire key with the photo/swatch */
  .eu-pg2__panel--bg .eu-pg2__cell--front{
    position:relative;
    overflow:hidden;
    padding:0;
    gap:0;
  }
  .eu-pg2__panel--bg .eu-pg2__cell--front .eu-pg2__cell-img{
    position:absolute;
    inset:0;
    width:100%; height:100%;
    aspect-ratio:auto;
    border-radius:0;
  }
  .eu-pg2__panel--bg .eu-pg2__cell--front .eu-pg2__cell-img img{
    width:100%; height:100%; object-fit:cover;
  }
  /* Re-anchor the rainbow dot for the colour cell */
  .eu-pg2__panel--bg .eu-pg2__cell--front .eu-pg2__cell-img--swatch::after{
    top:50%; left:50%;
  }
  /* Format buttons — drop the "Feed ·" / "Story ·" prefix on mobile so
     the buttons read "4:5" / "9:16" and fit cleanly. */
  .eu-pg2__format-btn{ font-size:14px; padding:0 4px; }
  .eu-pg2__format-name{ display:none; }
  /* Tools */
  .eu-pg2__cell--tool .eu-pg2__cell-label{ display:none; }
  .eu-pg2__cell--tool .eu-pg2__cell-img{ width:22px; height:22px; }

  /* Full-width rows beneath the toolbar */
  .eu-pg2__panel--pencil{ order:4; flex:0 0 100%; margin-top:24px; min-width:0; max-width:100%; }
  .eu-pg2__panel--motion{ order:5; flex:0 0 100%; margin-top:0; min-width:0; max-width:100%; }
  .eu-pg2__panel--send{ order:6; flex:0 0 100%; margin-top:0; min-width:0; max-width:100%; }
  .eu-pg2__panel--pencil .eu-pg2__panel-body{ min-width:0; max-width:100%; overflow:hidden; }

  /* Uniform cell height across every control row on mobile */
  .eu-pg2__panel--bg .eu-pg2__cell--front,
  .eu-pg2__format-btn,
  .eu-pg2__cell--tool{
    height:50px;
    aspect-ratio:auto;
    padding:0;
  }

  /* BG row: image + colour + format below as small icons */
  .eu-pg2__panel--bg{ padding:6px; }
  .eu-pg2__panel--bg .eu-pg2__bg-row{ gap:6px; }
  .eu-pg2__panel--bg .eu-pg2__cell--front .eu-pg2__cell-img{ width:100%; height:100%; aspect-ratio:auto; }
  .eu-pg2__format-toggle{ margin-top:6px; gap:6px; }
  .eu-pg2__format-btn{ font-size:13px; }

  /* Tools: icon-only row */
  .eu-pg2__panel--draw{ padding:6px; }
  .eu-pg2__panel--draw .eu-pg2__cell-grid--tools{ grid-template-columns:repeat(4,1fr); gap:6px; }
  .eu-pg2__cell--tool .eu-pg2__cell-label{ display:none; }
  .eu-pg2__cell--tool .eu-pg2__cell-img{ width:24px; height:24px; }

  /* Unified horizontal-scroll rows — let content drive height, no clipping */
  .eu-pg2__panel--pencil{
    padding:8px 0 0;
    height:auto;
    overflow:visible;
  }
  .eu-pg2__panel--motion{
    padding:8px 0;
    height:auto;
    overflow:visible;
  }
  .eu-pg2__panel--pencil .eu-pg2__section-head,
  .eu-pg2__panel--pencil .eu-pg2__section-rule,
  .eu-pg2__panel--pencil .eu-pg2__panel-nameplate,
  .eu-pg2__panel--motion .eu-pg2__section-head,
  .eu-pg2__panel--motion .eu-pg2__section-rule{
    display:none;
  }
  .eu-pg2__panel--pencil .eu-pg2__panel-body,
  .eu-pg2__panel--motion .eu-pg2__panel-body{
    padding:0;
    width:100%;
    height:auto;
    overflow:hidden;
  }
  #euPg2PastryGrid{ width:100%; max-width:100%; overflow:hidden; }

  /* Inner grids — flex row, scroll horizontally, room to breathe vertically */
  .eu-pg2__panel--pencil .eu-pg2__cell-grid--stamps,
  .eu-pg2__panel--motion .eu-pg2__cell-grid--motion{
    display:flex !important;
    flex-wrap:nowrap !important;
    overflow-x:auto !important;
    overflow-y:hidden;
    -webkit-overflow-scrolling:touch;
    grid-template-columns:none !important;
    grid-template-rows:none;
    gap:8px;
    padding:4px 10px;
    width:100%;
    max-width:100%;
    align-items:center;
    scrollbar-width:none;
    -webkit-mask-image:linear-gradient(to right, transparent 0, #000 24px, #000 calc(100% - 48px), transparent 100%);
    mask-image:linear-gradient(to right, transparent 0, #000 24px, #000 calc(100% - 48px), transparent 100%);
  }
  .eu-pg2__panel--pencil .eu-pg2__cell-grid--stamps::-webkit-scrollbar,
  .eu-pg2__panel--motion .eu-pg2__cell-grid--motion::-webkit-scrollbar{ display:none; }

  /* Pencil cells — square 1:1, image scales to contain */
  .eu-pg2__panel--pencil .eu-pg2__cell-grid--stamps .eu-pg2__cell{
    flex:0 0 56px;
    width:56px;
    height:56px;
    aspect-ratio:1/1;
    padding:6px;
    display:flex;
    align-items:center;
    justify-content:center;
    overflow:hidden;
  }
  .eu-pg2__panel--pencil .eu-pg2__cell-grid--stamps .eu-pg2__cell-img{
    width:100%;
    height:100%;
    display:flex;
    align-items:center;
    justify-content:center;
  }
  .eu-pg2__panel--pencil .eu-pg2__cell-grid--stamps .eu-pg2__cell-img img{
    width:100%;
    height:100%;
    max-width:100%;
    max-height:100%;
    object-fit:contain;
  }
  .eu-pg2__panel--pencil .eu-pg2__cell-grid--stamps .eu-pg2__cell-img--eu img{
    width:170%;
    height:170%;
    max-width:170%;
    max-height:170%;
  }

  /* Motion cells */
  .eu-pg2__cell--motion{
    flex:0 0 auto;
    height:48px;
    padding:0 18px;
    display:flex;
    align-items:center;
    justify-content:center;
  }
  .eu-pg2__cell--motion .eu-pg2__cell-label{
    font-size:12px;
    letter-spacing:.05em;
    line-height:1;
  }

  /* Hide size slider on mobile to save space */
  .eu-pg2__size{ display:none; }

  /* Share + Download */
  .eu-pg2__action-btn{ height:52px; font-size:17px; }
}
