@import url('https://fonts.googleapis.com/css2?family=Syne:wght@400;700;800&family=Outfit:wght@300;400;500;600&family=JetBrains+Mono:wght@400;500&display=swap');

:root {
  --bg:    #07080f;
  --s1:    #0c0e1c;
  --s2:    #11132a;
  --bd:    #1c1f3d;
  --bd2:   #272b52;
  --gold:  #00ff88;
  --gold2: #00cfff;
  --gold3: #39ffb4;
  --cream: #e8eeff;
  --tx:    #e8eeff;
  --mu:    #6b7ab0;
  --er:    #ff2d78;
  --dim:   #090b18;
  /* new tokens */
  --neon:  #00ff88;
  --pink:  #ff2d78;
  --cyan:  #00cfff;
  --purp:  #7b2fff;
  --fg:    #e8eeff;
  --ac:    #c9963e;
}

#pm-app {
  font-family: 'Outfit', sans-serif;
  color: var(--tx);
  background: var(--bg);
  max-width: 1400px;
  margin: 0 auto;
  padding: 24px 16px 100px;
}

/* ── HERO ── */
.pm-hero {
  display: flex; align-items: flex-end;
  justify-content: space-between;
  gap: 24px; margin-bottom: 20px; flex-wrap: wrap;
}
.pm-hero-title {
  font-family: 'Syne', sans-serif;
  font-size: clamp(32px, 4.5vw, 58px);
  font-weight: 600; line-height: 1.1;
  margin: 0 0 10px; letter-spacing: -.3px;
  color: var(--tx);
}
.pm-hero-title em { font-style: normal; background: linear-gradient(90deg,var(--neon),var(--cyan)); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; }
.pm-hero-sub {
  font-size: 15px; color: var(--mu); margin: 0;
  font-weight: 300; letter-spacing: .03em;
}
.pm-stats-inline {
  display: flex; align-items: center;
  gap: 10px; flex-shrink: 0; flex-wrap: wrap;
}
.pm-stat-pill { font-family: 'JetBrains Mono', monospace; font-size: 12px; color: var(--mu); white-space: nowrap; }
.pm-stat-pill span { color: var(--gold2); font-weight: 500; }
.pm-stat-sep { color: var(--bd2); }

/* ── TICKER ── */
.pm-ticker-wrap {
  display: flex; align-items: center;
  background: var(--s1); border: 1px solid var(--bd);
  border-radius: 4px; margin: 0 0 14px;
  overflow: hidden; height: 36px;
}
.pm-ticker-label {
  font-family: 'JetBrains Mono', monospace; font-size: 8px;
  font-weight: 500; letter-spacing: .18em; color: var(--gold);
  padding: 0 16px; white-space: nowrap;
  border-right: 1px solid var(--bd); height: 100%;
  display: flex; align-items: center; flex-shrink: 0;
  text-transform: uppercase;
}
.pm-ticker-track { flex: 1; overflow: hidden; height: 100%; }
.pm-ticker-inner {
  display: flex; align-items: center;
  white-space: nowrap; height: 100%;
  animation: pm-ticker-scroll 55s linear infinite;
}
.pm-ticker-inner:hover { animation-play-state: paused; }
@keyframes pm-ticker-scroll {
  0%   { transform: translateX(100%); }
  100% { transform: translateX(-100%); }
}
.pm-ticker-item { display: inline-flex; align-items: center; gap: 8px; padding: 0 32px 0 0; font-size: 12px; color: var(--mu); }
.pm-ticker-dot  { width: 5px; height: 5px; border-radius: 50%; flex-shrink: 0; }
.pm-ticker-name { color: var(--tx); font-weight: 500; }
.pm-ticker-moment { color: var(--mu); font-style: italic; }
.pm-ticker-sep  { color: var(--bd2); margin: 0 6px; }
.pm-ticker-empty { font-size: 11px; color: var(--mu); padding: 0 20px; opacity: .4; }

/* ── LAYOUT ── */
.pm-main-layout { display: grid; grid-template-columns: 1fr 340px; gap: 16px; align-items: start; }
.pm-grid-col { display: flex; flex-direction: column; gap: 12px; }

/* ── GRID — gold-framed polaroid ── */
.pm-grid-wrap {
  position: relative;
  background: var(--bd);
  padding: 3px;
  border-radius: 2px;
  box-shadow:
    0 0 0 1px rgba(201,150,62,.2),
    0 4px 12px rgba(0,0,0,.4),
    0 16px 48px rgba(0,0,0,.5),
    0 32px 80px rgba(0,0,0,.3);
  transform: none;
  transition: transform .4s cubic-bezier(.22,1,.36,1), box-shadow .4s;
}
.pm-grid-wrap:hover {
  transform: none;
  box-shadow:
    0 0 0 1px rgba(201,150,62,.35),
    0 8px 24px rgba(0,0,0,.45),
    0 24px 64px rgba(0,0,0,.55),
    0 0 80px rgba(201,150,62,.05);
}
.pm-grid-inner {
  position: relative; background: #06050a;
  overflow: hidden; border-radius: 1px;
}
.pm-grid-inner::before { content: ''; display: block; padding-top: min(65vh, 100%); }
#pm-canvas, #pm-overlay {
  position: absolute; top: 0; left: 0;
  width: 100%; height: 100%;
  image-rendering: pixelated;
}
#pm-overlay { cursor: crosshair; }
.pm-grid-label {
  text-align: center; padding: 6px 0 4px;
  font-family: 'JetBrains Mono', monospace; font-size: 9px;
  color: #8a7a60; letter-spacing: .12em;
  text-transform: uppercase; user-select: none;
  background: var(--bd);
  border-top: 1px solid rgba(201,150,62,.2);
}
.pm-zoom-btns {
  position: absolute; top: 12px; right: 12px;
  display: flex; flex-direction: column; gap: 3px; z-index: 10;
}
.pm-zoom-btns button {
  width: 28px; height: 28px;
  background: rgba(8,7,6,.88); border: 1px solid var(--bd2);
  color: var(--tx); font-size: 15px; border-radius: 2px;
  cursor: pointer; display: flex; align-items: center; justify-content: center;
  transition: all .15s; font-family: monospace;
  backdrop-filter: blur(4px);
}
.pm-zoom-btns button:hover { background: var(--gold); color: #080706; border-color: var(--gold); }
.pm-hint {
  position: absolute; bottom: 10px; left: 50%; transform: translateX(-50%);
  font-size: 10px; color: rgba(255,255,255,.25);
  background: rgba(8,7,6,.75); padding: 3px 12px;
  border-radius: 20px; pointer-events: none;
  font-family: 'JetBrains Mono', monospace; white-space: nowrap;
}

/* ── TOOLTIP ── */
.pm-tooltip {
  position: fixed; z-index: 9999;
  background: var(--s1); border: 1px solid var(--bd2);
  border-radius: 6px; padding: 10px 14px;
  font-size: 12px; max-width: 200px;
  pointer-events: none;
  box-shadow: 0 8px 24px rgba(0,0,0,.6); display: none;
}
.pm-tt-name   { font-weight: 600; color: var(--gold); margin-bottom: 3px; }
.pm-tt-moment { color: var(--mu); font-size: 11px; margin-top: 3px; font-style: italic; }
.pm-tt-coords { font-size: 10px; color: var(--mu); margin-top: 5px; font-family: 'JetBrains Mono', monospace; }

/* ── AUCTIONS ── */
.pm-auctions-bar {
  display: flex; align-items: center; gap: 10px;
  background: linear-gradient(90deg,rgba(201,150,62,.06),transparent);
  border: 1px solid rgba(201,150,62,.2); border-radius: 4px;
  padding: 10px 16px; overflow-x: auto;
}
.pm-auction-label { font-family: 'JetBrains Mono', monospace; font-size: 10px; color: var(--gold2); letter-spacing: .1em; white-space: nowrap; text-transform: uppercase; }
.pm-auction-chip {
  display: flex; align-items: center; gap: 8px;
  background: rgba(201,150,62,.08); border: 1px solid rgba(201,150,62,.25);
  border-radius: 3px; padding: 5px 12px; cursor: pointer;
  font-size: 12px; transition: background .2s; white-space: nowrap;
}
.pm-auction-chip:hover { background: rgba(201,150,62,.16); }
.pm-auction-bid   { font-family: 'JetBrains Mono', monospace; font-size: 14px; color: var(--gold2); }
.pm-auction-timer { font-family: 'JetBrains Mono', monospace; font-size: 10px; color: var(--mu); }

/* ── SIDE PANEL ── */
.pm-side-panel {
  background: var(--s1); border: 1px solid var(--bd);
  border-radius: 4px; position: sticky; top: 20px;
  overflow: hidden; transition: border-color .3s, box-shadow .3s;
}
.pm-side-panel.has-selection {
  border-color: var(--gold);
  box-shadow: 0 0 40px rgba(201,150,62,.07);
}

/* IDLE — stacked polaroid visual */
.pm-panel-idle {
  padding: 28px 22px; display: flex; flex-direction: column;
  align-items: center; text-align: center; gap: 10px;
}
.pm-panel-idle-polaroids {
  position: relative; width: 86px; height: 88px; margin-bottom: 6px;
}
.pm-idle-pol {
  position: absolute; border-radius: 1px;
  box-shadow: 0 2px 8px rgba(0,0,0,.5);
}
.pm-idle-pol--1 { width: 48px; height: 48px; background: linear-gradient(135deg,rgba(123,47,255,.3),rgba(0,207,255,.2)); border: 1px solid rgba(0,207,255,.4); transform: rotate(-10deg); top: 4px; left: 2px; box-shadow: 0 0 12px rgba(0,207,255,.2); }
.pm-idle-pol--2 { width: 50px; height: 50px; background: linear-gradient(135deg,rgba(0,255,136,.2),rgba(123,47,255,.2)); border: 1px solid rgba(0,255,136,.35); transform: rotate(3deg); top: 10px; left: 16px; }
.pm-idle-pol--3 { width: 52px; height: 52px; background: linear-gradient(135deg,rgba(0,207,255,.25),rgba(0,255,136,.15)); border: 1px solid rgba(0,255,136,.5); transform: rotate(-1deg); top: 20px; left: 30px; box-shadow: 0 0 16px rgba(0,255,136,.25); }
.pm-panel-idle-title {
  font-family: 'Syne', sans-serif;
  font-size: 20px; font-weight: 600; color: var(--tx);
}
.pm-panel-idle-sub { font-size: 13px; color: var(--mu); line-height: 1.55; max-width: 220px; }
.pm-panel-idle-tips { display: flex; flex-direction: column; gap: 5px; margin-top: 4px; width: 100%; }
.pm-tip { display: flex; align-items: center; gap: 10px; font-size: 12px; color: var(--mu); padding: 5px 10px; background: var(--s2); border-radius: 3px; }
.pm-tip-key { font-family: 'JetBrains Mono', monospace; font-size: 10px; background: var(--bd); padding: 2px 6px; border-radius: 2px; color: var(--tx); white-space: nowrap; }
.pm-mini-map { border-radius: 3px; border: 1px solid var(--bd); margin-top: 10px; display: block; }
.pm-pricing-hint { display: flex; flex-direction: column; gap: 3px; font-family: 'JetBrains Mono', monospace; font-size: 10px; margin-top: 6px; text-align: center; }
.pm-ph-center { color: var(--gold); }
.pm-ph-edge   { color: var(--mu); }

/* ACTIVE */
.pm-panel-active { padding: 20px; }
.pm-zone-badge {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 4px 12px; border-radius: 3px;
  font-family: 'JetBrains Mono', monospace; font-size: 11px;
  letter-spacing: .08em; margin-bottom: 14px; border: 1px solid; text-transform: uppercase;
}
.pm-zone-badge.zone-center { background: rgba(201,150,62,.1); border-color: rgba(201,150,62,.35); color: var(--gold); }
.pm-zone-badge.zone-mid    { background: rgba(232,185,106,.1); border-color: rgba(232,185,106,.3); color: var(--gold2); }
.pm-zone-badge.zone-edge   { background: rgba(122,106,80,.1);  border-color: rgba(122,106,80,.3);  color: var(--mu); }

.pm-price-display { background: var(--s2); border: 1px solid var(--bd); border-radius: 4px; padding: 16px; margin-bottom: 14px; text-align: center; }
.pm-price-main { font-family: 'Syne', sans-serif; font-size: 48px; font-weight: 700; color: var(--gold); line-height: 1; }
.pm-price-detail { font-size: 11px; color: var(--mu); font-family: 'JetBrains Mono', monospace; margin-top: 4px; }
.pm-price-breakdown { margin-top: 12px; border-top: 1px solid var(--bd); padding-top: 12px; text-align: left; }
.pm-pb-row { display: flex; justify-content: space-between; font-size: 11px; color: var(--mu); padding: 3px 0; font-family: 'JetBrains Mono', monospace; }
.pm-pb-charity { color: var(--gold3); }
.pm-pb-you { color: var(--tx); font-weight: 500; border-top: 1px solid var(--bd); padding-top: 6px; margin-top: 4px; }
.pm-pb-toggle { background: none; border: none; color: var(--mu); font-size: 11px; font-family: 'JetBrains Mono', monospace; cursor: pointer; margin-top: 6px; transition: color .15s; }
.pm-pb-toggle:hover { color: var(--gold); }

.pm-sel-recap { display: flex; flex-direction: column; gap: 4px; margin-bottom: 14px; }
.pm-recap-row { display: flex; justify-content: space-between; font-size: 11px; padding: 5px 10px; background: var(--s2); border-radius: 3px; }
.pm-recap-lbl { color: var(--mu); font-family: 'JetBrains Mono', monospace; }
.pm-recap-val { color: var(--tx); font-family: 'JetBrains Mono', monospace; font-weight: 500; }
.pm-btn-clear-sel { background: none; border: 1px solid var(--bd); color: var(--mu); padding: 6px; border-radius: 3px; cursor: pointer; font-size: 11px; font-family: 'JetBrains Mono', monospace; transition: all .15s; margin-top: 4px; width: 100%; }
.pm-btn-clear-sel:hover { border-color: var(--er); color: var(--er); }

/* ── FORM ── */
.pm-buy { margin-top: 32px; background: var(--s1); border: 1px solid var(--bd); border-radius: 4px; padding: 40px 44px; }
.pm-buy-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; margin-bottom: 32px; flex-wrap: wrap; }
.pm-buy-title { font-family: 'Syne', sans-serif; font-size: 32px; font-weight: 600; margin: 0 0 6px; color: var(--tx); }
.pm-buy-sub { font-size: 13px; color: var(--mu); margin: 0; line-height: 1.6; }

.pm-buy-recap-badge { display: flex; align-items: center; gap: 10px; background: var(--s2); border: 1px solid var(--bd); padding: 10px 16px; border-radius: 4px; flex-shrink: 0; }
.pm-buy-recap-badge span { font-family: 'JetBrains Mono', monospace; font-size: 11px; color: var(--mu); }
.pm-buy-recap-badge strong { font-family: 'Syne', sans-serif; font-size: 24px; font-weight: 700; color: var(--gold); }
.pm-buy-badge-clear { background: none; border: none; color: var(--mu); cursor: pointer; font-size: 12px; padding: 0; transition: color .15s; }
.pm-buy-badge-clear:hover { color: var(--er); }

.pm-sel-empty { background: var(--s2); border: 1px dashed var(--bd); border-radius: 4px; padding: 14px 18px; font-size: 13px; color: var(--mu); font-family: 'JetBrains Mono', monospace; margin-bottom: 20px; }

.pm-buy-form { display: flex; flex-direction: column; gap: 16px; }
.pm-frow { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.pm-full { grid-column: 1 / -1; }
.pm-fg { display: flex; flex-direction: column; gap: 6px; }
.pm-fg label { font-family: 'JetBrains Mono', monospace; font-size: 9px; font-weight: 500; color: var(--mu); text-transform: uppercase; letter-spacing: .1em; }
.pm-fg label em { color: var(--gold); font-style: normal; }
.pm-fg label small { font-weight: 400; text-transform: none; letter-spacing: 0; font-size: 10px; }
.pm-fg input[type=text],
.pm-fg input[type=email],
.pm-fg input[type=url],
.pm-fg textarea {
  background: var(--s2); border: 1px solid var(--bd);
  border-radius: 4px; color: var(--tx);
  padding: 11px 14px; font-size: 14px;
  font-family: 'Outfit', sans-serif;
  outline: none; transition: border-color .2s, box-shadow .2s;
  width: 100%; box-sizing: border-box;
}
.pm-fg textarea { resize: vertical; min-height: 90px; }
.pm-fg input:focus, .pm-fg textarea:focus { border-color: var(--gold); box-shadow: 0 0 0 2px rgba(201,150,62,.1); }
.pm-embed-preview { margin-top: 10px; border-radius: 6px; overflow: hidden; }

.pm-color-row, .pm-promo-row { display: flex; align-items: center; gap: 8px; }
.pm-color-row input[type=color] { width: 38px; height: 38px; border: 1px solid var(--bd); border-radius: 4px; padding: 2px; background: var(--s2); cursor: pointer; }
#pm-color-swatch { width: 28px; height: 28px; border-radius: 4px; border: 1px solid var(--bd); }
#pm-color-val { font-family: 'JetBrains Mono', monospace; font-size: 11px; color: var(--mu); }
.pm-promo-row input { flex: 1; background: var(--s2); border: 1px solid var(--bd); border-radius: 4px; color: var(--tx); padding: 9px 12px; font-size: 13px; font-family: 'JetBrains Mono', monospace; outline: none; transition: border-color .2s; }
.pm-promo-row input:focus { border-color: var(--gold); }

.pm-btn-secondary {
  background: transparent; border: 1px solid var(--bd); color: var(--mu);
  padding: 9px 14px; border-radius: 4px; cursor: pointer;
  font-size: 12px; white-space: nowrap; transition: all .2s;
  display: inline-flex; align-items: center; gap: 7px;
}
.pm-btn-secondary:hover { border-color: var(--gold); color: var(--gold); }
.pm-file-label { cursor: pointer; }
.pm-btn-ghost { background: transparent; border: 1px solid var(--bd2); color: var(--mu); border-radius: 4px; padding: 5px 12px; font-size: 12px; cursor: pointer; transition: all .2s; display: inline-flex; align-items: center; gap: 6px; }
.pm-btn-ghost:hover { color: var(--tx); }
.pm-small { padding: 5px 10px; font-size: 12px; }

#pm-webcam-video { width: 100%; max-width: 400px; border-radius: 6px; border: 1px solid var(--bd); background: #000; }
.pm-webcam-wrap { display: flex; flex-direction: column; gap: 10px; }
.pm-webcam-btns { display: flex; gap: 8px; flex-wrap: wrap; }
.pm-webcam-capture { display: flex; gap: 8px; align-items: center; }
.pm-webcam-preview { position: relative; display: inline-flex; flex-direction: column; gap: 8px; }
.pm-webcam-preview img {
  max-width: 180px;
  background: #f0e8d5;
  padding: 6px 6px 24px;
  box-shadow: 0 4px 16px rgba(0,0,0,.5);
  transform: rotate(1deg);
}

.pm-err { background: rgba(201,64,64,.08); border: 1px solid rgba(201,64,64,.25); border-radius: 4px; padding: 10px 14px; font-size: 13px; color: var(--er); }

.pm-btn-buy {
  background: linear-gradient(90deg,var(--neon),var(--cyan)); color: #07080f; border: none; border-radius: 8px;
  padding: 16px; font-family: 'Syne', sans-serif;
  font-size: 22px; font-weight: 700; letter-spacing: .03em;
  cursor: pointer; transition: opacity .2s, transform .1s; width: 100%; margin-top: 4px;
}
.pm-btn-buy:hover:not(:disabled) { opacity: .9; transform: translateY(-1px); }
.pm-btn-buy:disabled { opacity: .25; cursor: not-allowed; }

.pm-charity-note { font-size: 12px; color: var(--mu); text-align: center; margin-top: 4px; display: flex; align-items: center; justify-content: center; gap: 5px; }
.pm-charity-note a { color: var(--gold3); text-decoration: none; }
.pm-charity-note a:hover { text-decoration: underline; }

.pm-btn-buy-cta {
  width: 100%; background: var(--gold); color: #080706; border: none; border-radius: 4px;
  padding: 13px; font-family: 'Syne', sans-serif;
  font-size: 18px; font-weight: 700;
  cursor: pointer; transition: opacity .2s, transform .1s;
}
.pm-btn-buy-cta:hover { opacity: .9; transform: translateY(-1px); }

/* ── SUCCESS PAGE ── */
.pm-success-page { min-height: 70vh; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 60px 24px; text-align: center; }
.pm-success-polaroid {
  background: linear-gradient(145deg, #f0e8d5, #e8dcc8);
  padding: 10px 10px 44px;
  box-shadow: 0 0 0 1px rgba(201,150,62,.3), 0 8px 32px rgba(0,0,0,.6), 0 2px 8px rgba(0,0,0,.4);
  border-radius: 1px; transform: rotate(-1.5deg);
  max-width: 260px; width: 100%; margin-bottom: 44px;
  transition: transform .4s ease;
}
.pm-success-polaroid:hover { transform: rotate(0deg); }
.pm-success-photo { width: 100%; aspect-ratio: 1; background: #d8cca8; overflow: hidden; }
.pm-success-photo img { width: 100%; height: 100%; object-fit: cover; display: block; }
.pm-success-photo--empty { display: flex; align-items: center; justify-content: center; background: linear-gradient(135deg, #e8dcc8, #d8ccb0); color: #b0a080; }
.pm-success-polaroid-caption { padding: 10px 4px 0; font-family: 'Outfit', sans-serif; }
.pm-success-polaroid-text { font-style: italic; font-size: 11px; color: #5a4a35; margin: 0 0 5px; line-height: 1.4; }
.pm-success-polaroid-name { font-weight: 600; font-size: 12px; color: #2a2018; margin: 0 0 2px; }
.pm-success-polaroid-date { font-size: 10px; color: #8a7a60; margin: 0; font-family: 'JetBrains Mono', monospace; }

.pm-success-title { font-family: 'Syne', sans-serif; font-size: clamp(32px, 5vw, 64px); font-weight: 600; line-height: 1.15; color: var(--tx); margin: 0 0 14px; }
.pm-success-title em { font-style: italic; color: var(--gold); }
.pm-success-sub { font-size: 15px; color: var(--mu); margin: 0 0 28px; max-width: 420px; line-height: 1.6; }
.pm-success-sub strong { color: var(--tx); }
.pm-success-archive { display: flex; align-items: center; gap: 12px; background: rgba(201,150,62,.06); border: 1px solid rgba(201,150,62,.2); border-radius: 4px; padding: 14px 20px; max-width: 420px; margin-bottom: 32px; text-align: left; font-size: 13px; color: var(--gold3); line-height: 1.5; }
.pm-success-archive strong { color: var(--tx); }
.pm-success-ctas { display: flex; gap: 12px; flex-wrap: wrap; justify-content: center; }
.pm-btn-emotion { background: var(--gold); color: #080706; text-decoration: none; padding: 14px 32px; border-radius: 4px; font-family: 'Syne', sans-serif; font-size: 20px; font-weight: 700; transition: opacity .2s, transform .1s; display: inline-block; }
.pm-btn-emotion:hover { opacity: .9; transform: translateY(-1px); }

/* ── FLOATING PLAYER ── */
.pm-float-player {
  position: fixed; bottom: 24px; left: 50%; transform: translateX(-50%);
  width: min(560px, calc(100vw - 32px));
  background: rgba(8, 7, 6, 0.95); backdrop-filter: blur(20px);
  border: 1px solid var(--bd2); border-radius: 8px; overflow: hidden;
  z-index: 9990; display: flex; flex-direction: column;
  box-shadow: 0 8px 40px rgba(0,0,0,.7), 0 0 0 1px rgba(201,150,62,.06);
}
.pm-fp-bar { height: 2px; background: var(--gold); transition: background 0.4s ease; flex-shrink: 0; }
.pm-fp-body { display: flex; align-items: center; gap: 12px; padding: 11px 14px; transition: opacity 0.2s; }
.pm-fp-photo { flex-shrink: 0; width: 42px; height: 52px; background: linear-gradient(145deg,#e8dcc8,#d4c4a0); padding: 2px 2px 10px; box-shadow: 0 2px 8px rgba(0,0,0,.5); border-radius: 1px; }
.pm-fp-photo img { width: 100%; height: calc(100% - 8px); object-fit: cover; display: block; }
.pm-fp-content { flex: 1; min-width: 0; }
.pm-fp-label { font-family: 'JetBrains Mono', monospace; font-size: 8px; letter-spacing: 2px; color: var(--mu); text-transform: uppercase; margin-bottom: 3px; }
.pm-fp-text { font-size: 13px; font-style: italic; color: var(--tx); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; line-height: 1.4; }
.pm-fp-meta { font-size: 11px; color: var(--mu); margin-top: 2px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pm-fp-meta strong { color: var(--tx); }
.pm-fp-nav { display: flex; align-items: center; gap: 5px; flex-shrink: 0; }
.pm-fp-nav button { background: var(--s2); border: 1px solid var(--bd); color: var(--tx); border-radius: 3px; width: 24px; height: 24px; font-size: 16px; cursor: pointer; display: flex; align-items: center; justify-content: center; transition: border-color .2s, color .2s; }
.pm-fp-nav button:hover { border-color: var(--gold); color: var(--gold); }
.pm-fp-nav span { font-family: 'JetBrains Mono', monospace; font-size: 10px; color: var(--mu); min-width: 32px; text-align: center; }
.pm-fp-close { background: none; border: 1px solid var(--bd); color: var(--mu); border-radius: 3px; width: 24px; height: 24px; font-size: 12px; cursor: pointer; flex-shrink: 0; display: flex; align-items: center; justify-content: center; transition: border-color .2s, color .2s; }
.pm-fp-close:hover { border-color: var(--er); color: var(--er); }
.pm-fp-restore { position: fixed; bottom: 24px; left: 50%; transform: translateX(-50%); background: rgba(8,7,6,.95); backdrop-filter: blur(12px); border: 1px solid var(--gold); color: var(--gold); border-radius: 20px; padding: 6px 18px; font-family: 'JetBrains Mono', monospace; font-size: 11px; letter-spacing: .1em; cursor: pointer; z-index: 9990; display: none; align-items: center; gap: 6px; transition: background .2s; }
.pm-fp-restore:hover { background: rgba(201,150,62,.1); }

/* ── WEBCAM ── */
.pm-webcam-section label { margin-bottom: 8px; }

/* ── RESPONSIVE ── */
@media(max-width:960px) { .pm-main-layout { grid-template-columns: 1fr; } .pm-side-panel { position: static; } .pm-grid-wrap { transform: none; } .pm-grid-wrap:hover { transform: none; } }
@media(max-width:700px) { .pm-frow { grid-template-columns: 1fr; } .pm-buy { padding: 24px 18px; } .pm-buy-header { flex-direction: column; } .pm-hero { flex-direction: column; gap: 12px; } }
@media(max-width:480px) { .pm-stats-inline { display: none; } }

/* ════════════════════════════════════════════════════════════
   ANIMATED BACKGROUND BLOBS
════════════════════════════════════════════════════════════ */
#pm-bg-layer {
  position: fixed; inset: 0; pointer-events: none; z-index: 0; overflow: hidden;
}
.pm-blob { position: absolute; border-radius: 50%; filter: blur(90px); will-change: transform; }
.pm-blob-1 { width:700px;height:700px;background:#7b2fff;opacity:.18;top:-250px;left:-200px;animation:pm-blob1 28s ease-in-out infinite alternate; }
.pm-blob-2 { width:600px;height:600px;background:#00cfff;opacity:.14;bottom:-200px;right:-150px;animation:pm-blob2 35s ease-in-out infinite alternate; }
.pm-blob-3 { width:450px;height:450px;background:#00ff88;opacity:.09;top:45%;left:35%;animation:pm-blob3 22s ease-in-out infinite alternate; }
@keyframes pm-blob1 { from{transform:translate(0,0)scale(1)} to{transform:translate(380px,420px)scale(1.35)} }
@keyframes pm-blob2 { from{transform:translate(0,0)scale(1)} to{transform:translate(-320px,-380px)scale(1.2)} }
@keyframes pm-blob3 { from{transform:translate(0,0)rotate(0deg)scale(1)} to{transform:translate(180px,-260px)rotate(90deg)scale(.75)} }

#pm-grain {
  position:fixed;inset:0;pointer-events:none;z-index:1;opacity:.04;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)'/%3E%3C/svg%3E");
  background-size:180px;animation:pm-grain-shift 1.2s steps(2) infinite;
}
@keyframes pm-grain-shift { 0%{transform:translate(0,0)} 25%{transform:translate(-3px,2px)} 50%{transform:translate(2px,-3px)} 75%{transform:translate(-2px,-2px)} 100%{transform:translate(3px,3px)} }

/* Ensure app sits above blobs */
#pm-app { position:relative;z-index:2; }

/* ════════════════════════════════════════════════════════════
   HEADER
════════════════════════════════════════════════════════════ */
#pmp-header {
  position:fixed;top:0;left:0;right:0;z-index:9999;
  display:flex;align-items:center;gap:32px;padding:0 40px;height:64px;
  background:rgba(7,8,15,.92);backdrop-filter:blur(20px);
  border-bottom:1px solid var(--bd);font-family:'Outfit',sans-serif;
}
.pmp-logo { text-decoration:none;flex-shrink:0; }
.pmp-logo-text { font-family:'Syne',sans-serif;font-size:14px;font-weight:800;letter-spacing:.15em;color:var(--neon);text-transform:uppercase; }
.pmp-logo-img { height:32px;width:auto; }
.pmp-nav-links { display:flex;align-items:center;gap:4px;flex:1; }
.pmp-nav-link { font-size:13px;color:var(--mu);text-decoration:none;padding:6px 12px;border-radius:4px;transition:color .2s,background .2s; }
.pmp-nav-link:hover { color:var(--tx);background:rgba(0,255,136,.05); }
.pmp-nav-link.active { color:var(--neon); }
.pmp-header-right { display:flex;align-items:center;gap:12px;margin-left:auto; }
.pmp-lang-sw { display:flex;gap:4px; }
.pmp-lang-btn { font-family:'JetBrains Mono',monospace;font-size:10px;letter-spacing:.1em;background:none;border:1px solid var(--bd);color:var(--mu);padding:4px 8px;border-radius:3px;cursor:pointer;transition:all .2s; }
.pmp-lang-btn:hover,.pmp-lang-btn.active { border-color:var(--neon);color:var(--neon); }
.pmp-header-cta { background:var(--neon);color:#07080f;font-family:'Syne',sans-serif;font-size:12px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;text-decoration:none;padding:8px 16px;border-radius:5px;transition:opacity .2s,box-shadow .2s;white-space:nowrap; }
.pmp-header-cta:hover { opacity:.88;box-shadow:0 0 16px rgba(0,255,136,.35); }
.pmp-hamburger { display:none;flex-direction:column;gap:5px;background:none;border:none;cursor:pointer;padding:4px; }
.pmp-hamburger span { display:block;width:22px;height:1px;background:var(--mu);transition:all .2s; }
.pmp-hamburger.open span:nth-child(1){transform:rotate(45deg)translate(4px,4px)}
.pmp-hamburger.open span:nth-child(2){opacity:0}
.pmp-hamburger.open span:nth-child(3){transform:rotate(-45deg)translate(4px,-4px)}
#pmp-mobile-menu { position:fixed;top:64px;left:0;right:0;background:rgba(7,8,15,.97);backdrop-filter:blur(20px);border-bottom:1px solid var(--bd);padding:24px 32px 32px;display:none;flex-direction:column;gap:4px;z-index:9998;opacity:0;transition:opacity .2s; }
#pmp-mobile-menu.open { display:flex;opacity:1; }
.pmp-mobile-link { font-size:18px;color:var(--mu);text-decoration:none;padding:10px 0;border-bottom:1px solid var(--bd);transition:color .2s; }
.pmp-mobile-link:hover { color:var(--neon); }
@media(max-width:768px) { #pmp-header{padding:0 20px} .pmp-nav-links{display:none} .pmp-header-cta{display:none} .pmp-hamburger{display:flex} .pmp-lang-sw{display:none} }

/* ════════════════════════════════════════════════════════════
   PAGES (home, terms, privacy)
════════════════════════════════════════════════════════════ */
.pmp-wrap { font-family:'Outfit',sans-serif;color:var(--tx);background:transparent;max-width:1200px;margin:0 auto;padding:64px 20px 80px;position:relative;z-index:2; }
.pmp-lang-switcher { display:none; }

.pmp-hero { min-height:72vh;display:flex;align-items:center;justify-content:center;text-align:center;padding:80px 24px 60px;position:relative;overflow:hidden; }
.pmp-hero::before { content:'';position:absolute;inset:0;background:radial-gradient(ellipse 80% 60% at 50% 40%,rgba(0,255,136,.06) 0%,transparent 70%);pointer-events:none; }
.pmp-hero-inner { position:relative;z-index:1;max-width:760px; }
.pmp-hero-tag { font-family:'JetBrains Mono',monospace;font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--neon);margin-bottom:24px;display:inline-flex;align-items:center;gap:10px; }
.pmp-hero-tag::before,.pmp-hero-tag::after { content:'';display:block;width:32px;height:1px;background:var(--neon);opacity:.4; }
.pmp-h1 { font-family:'Syne',sans-serif;font-size:clamp(38px,7vw,86px);font-weight:800;line-height:1.05;letter-spacing:-.5px;margin:0 0 24px;color:var(--tx); }
.pmp-h1 em { font-style:normal;background:linear-gradient(90deg,var(--neon),var(--cyan));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text; }
.pmp-hero-sub { font-size:18px;color:var(--mu);max-width:520px;margin:0 auto 40px;line-height:1.7;font-weight:300; }
.pmp-hero-ctas { display:flex;align-items:center;gap:14px;justify-content:center;flex-wrap:wrap; }

.pmp-btn-main { background:linear-gradient(90deg,var(--neon),var(--cyan));color:#07080f;font-family:'Syne',sans-serif;font-size:17px;font-weight:800;text-decoration:none;padding:14px 32px;border-radius:7px;border:none;cursor:pointer;display:inline-block;transition:opacity .2s,transform .15s,box-shadow .2s; }
.pmp-btn-main:hover { opacity:.9;transform:translateY(-2px);box-shadow:0 0 28px rgba(0,255,136,.35); }
.pmp-btn-main.pmp-btn-xl { font-size:20px;padding:18px 48px; }
.pmp-btn-ghost { background:none;border:1px solid var(--bd2);color:var(--mu);font-family:'Outfit',sans-serif;font-size:14px;padding:13px 24px;border-radius:7px;cursor:pointer;display:inline-block;transition:all .2s; }
.pmp-btn-ghost:hover { border-color:var(--neon);color:var(--neon); }

.pmp-strip { display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--bd);border-bottom:1px solid var(--bd);margin:0 0 80px; }
.pmp-strip-item { padding:28px 24px;text-align:center;border-right:1px solid var(--bd); }
.pmp-strip-item:last-child { border-right:none; }
.pmp-strip-val { font-family:'Syne',sans-serif;font-size:42px;font-weight:800;line-height:1;margin-bottom:6px;background:linear-gradient(135deg,var(--neon),var(--cyan));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text; }
.pmp-strip-lbl { font-family:'JetBrains Mono',monospace;font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--mu); }

.pmp-section { padding:60px 0;border-top:1px solid var(--bd); }
.pmp-sec-tag { font-family:'JetBrains Mono',monospace;font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--mu);margin-bottom:16px; }
.pmp-sec-title { font-family:'Syne',sans-serif;font-size:clamp(26px,3.5vw,44px);font-weight:800;margin:0 0 48px;color:var(--tx);line-height:1.1; }
.pmp-steps { display:grid;grid-template-columns:repeat(4,1fr);gap:24px; }
.pmp-step { padding:24px;background:var(--s1);border:1px solid var(--bd);border-radius:8px;transition:border-color .2s; }
.pmp-step:hover { border-color:rgba(0,255,136,.25); }
.pmp-step-num { font-family:'Syne',sans-serif;font-size:48px;font-weight:800;color:var(--bd2);line-height:1;margin-bottom:16px; }
.pmp-step-title { font-family:'JetBrains Mono',monospace;font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--neon);margin-bottom:10px; }
.pmp-step-desc { font-size:13px;color:var(--mu);line-height:1.6; }

.pmp-statement { padding:100px 24px;text-align:center;border-top:1px solid var(--bd);position:relative;overflow:hidden; }
.pmp-statement::before { content:'';position:absolute;inset:0;background:radial-gradient(ellipse 60% 80% at 50% 50%,rgba(0,255,136,.04) 0%,transparent 70%);pointer-events:none; }
.pmp-stmt-q { font-family:'Syne',sans-serif;font-size:clamp(26px,4vw,48px);font-weight:700;line-height:1.2;color:var(--mu);max-width:700px;margin:0 auto 32px;position:relative;z-index:1; }
.pmp-ac { background:linear-gradient(90deg,var(--neon),var(--cyan));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text; }
.pmp-charity-badge { font-size:14px;color:var(--mu);margin-bottom:40px;position:relative;z-index:1; }
.pmp-charity-badge a { color:var(--gold3);text-decoration:none; }
.pmp-charity-badge strong { color:var(--tx); }

.pmp-legal { max-width:720px;margin:0 auto;padding:48px 0; }
.pmp-legal-title { font-family:'Syne',sans-serif;font-size:clamp(26px,4vw,46px);font-weight:800;margin:0 0 8px;color:var(--tx); }
.pmp-legal-updated { font-family:'JetBrains Mono',monospace;font-size:11px;color:var(--mu);margin-bottom:32px;letter-spacing:.05em; }
.pmp-legal-highlight { background:rgba(0,255,136,.05);border-left:2px solid var(--neon);padding:16px 20px;margin-bottom:40px;font-size:14px;color:var(--mu);line-height:1.7;border-radius:0 6px 6px 0; }
.pmp-legal-h2 { font-family:'Syne',sans-serif;font-size:20px;font-weight:700;color:var(--tx);margin:36px 0 10px;border-bottom:1px solid var(--bd);padding-bottom:8px; }
.pmp-legal-p { font-size:14px;color:var(--mu);line-height:1.75;margin:0 0 8px; }
.pmp-legal-p a { color:var(--neon);text-decoration:none; }
.pmp-legal-p a:hover { text-decoration:underline; }
.pmp-legal-p ul { padding-left:20px; }
.pmp-legal-p li { margin-bottom:6px; }
.pmp-legal-p strong { color:var(--tx); }

@media(max-width:900px) { .pmp-steps{grid-template-columns:repeat(2,1fr)} .pmp-strip{grid-template-columns:repeat(2,1fr)} }
@media(max-width:600px) { .pmp-steps{grid-template-columns:1fr} .pmp-h1{font-size:36px} }

/* ════════════════════════════════════════════════════════════
   FLOATING PLAYER — SHARE BUTTON
════════════════════════════════════════════════════════════ */
.pm-fp-share {
  display: none;
  align-items: center; justify-content: center;
  width: 28px; height: 28px; flex-shrink: 0;
  border: 1px solid var(--bd2); border-radius: 4px;
  color: var(--mu); text-decoration: none;
  transition: border-color .2s, color .2s;
}
.pm-fp-share:hover { border-color: var(--neon); color: var(--neon); }

/* ════════════════════════════════════════════════════════════
   MOMENT PAGE — fullscreen grid + side panel
════════════════════════════════════════════════════════════ */

/* Neutralise Divi/theme wrappers that add white bg or padding */
body:has(.pmp-moment-page) .et_pb_section,
body:has(.pmp-moment-page) .et_pb_row,
body:has(.pmp-moment-page) .et_pb_column,
body:has(.pmp-moment-page) #page-container,
body:has(.pmp-moment-page) .entry-content {
  background: transparent !important;
  padding: 0 !important;
  margin: 0 !important;
  max-width: none !important;
}

.pmp-moment-page {
  position: fixed;
  top: 0; left: 0; right: 0; bottom: 0;
  z-index: 10;
  background: var(--bg);
  overflow: hidden;
}

/* Grid as subtle full-bg layer */
.pmp-mp-grid-col {
  position: absolute;
  top: 0; left: 0; right: 0; bottom: 0;
  z-index: 0;
  overflow: hidden;
  opacity: .15;
  pointer-events: none;
}
.pmp-mp-grid-col:after {
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse at center, transparent 20%, var(--bg) 75%);
  z-index: 1;
}

/* Fullscreen button */
.pmp-mp-fs-btn {
  position: absolute; top: 16px; right: 16px; z-index: 30;
  width: 32px; height: 32px;
  background: rgba(8,7,6,.7); backdrop-filter: blur(8px);
  border: 1px solid var(--bd2); border-radius: 6px;
  color: var(--mu); cursor: pointer; display: flex;
  align-items: center; justify-content: center;
  transition: color .2s, border-color .2s;
}
.pmp-mp-fs-btn:hover { color: var(--gold, #c9963e); border-color: var(--gold, #c9963e); }

/* Canvas wrapper */
.pmp-mp-grid-wrap {
  position: absolute;
  inset: 0;
  background: transparent;
  overflow: hidden;
}
#pmp-mp-canvas,
#pmp-mp-overlay,
#pmp-mp-pulse {
  position: absolute;
  top: 0; left: 0;
  width: 100%; height: 100%;
  display: block;
  image-rendering: pixelated;
}
#pmp-mp-canvas  { z-index: 1; }
#pmp-mp-overlay { z-index: 2; }
#pmp-mp-pulse   { z-index: 3; pointer-events: none; }

/* Main panel — fills viewport, flex column, centered */
.pmp-mp-panel {
  position: absolute;
  inset: 0;
  z-index: 20;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 60px 20px 20px; /* 44px bar + 16px gap */
  box-sizing: border-box;
  gap: 10px;
  overflow-y: auto;
}

/* Cards need pointer events restored */
.pmp-mp-panel-inner,
.pmp-success-outer,
.pmp-mp-empty-panel {
  pointer-events: auto;
}

/* Success card — sits above moment card */
.pmp-success-outer {
  width: 100%;
  max-width: 480px;
  background: rgba(8,7,6,.94);
  backdrop-filter: blur(24px);
  border: 1px solid rgba(201,150,62,.3);
  border-radius: 14px;
  overflow: hidden;
  box-shadow: 0 0 40px rgba(201,150,62,.08);
  flex-shrink: 0;
}

.pmp-mp-panel-inner {
  width: 100%;
  max-width: 480px;
  background: rgba(8,7,6,.94);
  backdrop-filter: blur(24px);
  border: 1px solid rgba(201,150,62,.18);
  border-radius: 16px;
  overflow: hidden;
  box-shadow: 0 0 80px rgba(0,0,0,.7), 0 0 0 1px rgba(201,150,62,.06);
  max-height: calc(100vh - 100px);
  overflow-y: auto;
  display: flex;
  flex-direction: column;
}
.pmp-mp-panel-inner::-webkit-scrollbar { width: 3px; }
.pmp-mp-panel-inner::-webkit-scrollbar-thumb { background: rgba(201,150,62,.3); }

/* Nav strip */
.pmp-mp-panel-nav {
  display: flex; align-items: center; justify-content: space-between;
  padding: 12px 18px; border-bottom: 1px solid var(--bd);
  flex-shrink: 0; background: rgba(201,150,62,.04);
}
.pmp-mp-nav-btn {
  font-family: 'JetBrains Mono', monospace; font-size: 14px;
  color: var(--mu); text-decoration: none;
  border: 1px solid var(--bd); border-radius: 4px;
  padding: 4px 12px; transition: all .15s;
  cursor: pointer; background: transparent;
}
.pmp-mp-nav-btn:hover { border-color: var(--gold, #c9963e); color: var(--gold, #c9963e); }
.pmp-mp-nav-count {
  font-family: 'JetBrains Mono', monospace; font-size: 11px; color: var(--mu);
}

/* Photo — full width, max 280px tall, no polaroid */
#pmp-mp-content { flex: 1; min-width: 0; }
.pmp-mp-photo {
  width: 100%;
  max-height: 280px;
  overflow: hidden;
  background: var(--s2);
  position: relative;
}
.pmp-mp-photo img {
  width: 100%; height: 100%;
  object-fit: cover; display: block;
  max-height: 280px;
}
.pmp-mp-photo::after {
  content: '';
  position: absolute;
  bottom: 0; left: 0; right: 0;
  height: 60px;
  background: linear-gradient(transparent, rgba(8,7,6,.8));
  pointer-events: none;
}

.pmp-mp-body { padding-bottom: 8px; }

/* Moment quote — big and centred */
.pmp-mcard-quote {
  font-family: 'Cormorant Garamond', 'Cormorant', Georgia, serif;
  font-size: 19px; font-style: italic; font-weight: 500;
  color: var(--tx); line-height: 1.5;
  margin: 16px 20px 12px; padding: 0;
  border: none;
  text-align: center;
}

/* Zone chip */
.pmp-mcard-zone {
  display: inline-flex; align-items: center; gap: 6px;
  font-size: 9px; font-weight: 700; letter-spacing: .12em;
  text-transform: uppercase;
  border: 1px solid; border-radius: 20px;
  padding: 3px 10px;
  margin: 12px auto 0;
  display: flex; width: fit-content;
}
.pmp-mcard-dot {
  width: 6px; height: 6px; border-radius: 50%; flex-shrink: 0;
}

/* Meta row: name + date */
.pmp-mcard-meta {
  display: flex; align-items: center; justify-content: center;
  gap: 8px; flex-wrap: wrap;
  padding: 10px 20px 4px;
}
.pmp-mcard-name {
  font-size: 13px; font-weight: 700; color: var(--tx);
}
.pmp-mcard-date {
  font-size: 11px; color: var(--mu); opacity: .6;
}

/* Tooltip */
.pmp-mcard-tip {
  font-size: 12px; color: var(--mu);
  text-align: center; line-height: 1.5;
}

/* Under review / pending notices */
.pmp-mp-review-notice {
  display: flex; align-items: flex-start; gap: 8px;
  padding: 10px 16px;
  background: rgba(201,150,62,.07); border-bottom: 1px solid rgba(201,150,62,.15);
  font-size: 11px; color: #c9963e; line-height: 1.5;
}
.pmp-mp-pending-notice {
  display: flex; align-items: flex-start; gap: 8px;
  margin: 12px 16px; padding: 10px 12px;
  background: rgba(59,130,246,.07); border: 1px solid rgba(59,130,246,.2); border-radius: 8px;
  font-size: 11px; color: #93c5fd; line-height: 1.5;
}

/* Share */
.pmp-mshare {
  padding: 12px 20px 18px;
  border-top: 1px solid var(--bd);
  margin-top: 4px;
}
.pmp-mshare-label {
  font-size: 9px; font-weight: 700; letter-spacing: .14em;
  text-transform: uppercase; color: var(--mu);
  text-align: center; margin-bottom: 10px;
}
.pmp-mshare-btns {
  display: flex; flex-wrap: wrap; gap: 6px; justify-content: center;
}
.pmp-share-btn {
  display: inline-flex; align-items: center; gap: 5px;
  padding: 7px 14px; border-radius: 6px;
  font-size: 11px; font-weight: 600; cursor: pointer;
  border: 1px solid var(--bd2); background: var(--s2); color: var(--tx);
  text-decoration: none; transition: all .15s; white-space: nowrap;
}
.pmp-share-btn:hover { border-color: var(--gold, #c9963e); color: var(--gold, #c9963e); }
.pmp-share-fb  { background: rgba(24,119,242,.12); border-color: rgba(24,119,242,.3); color: #60a5fa; }
.pmp-share-fb:hover  { background: rgba(24,119,242,.22); color: #93c5fd; }
.pmp-share-tw  { background: rgba(255,255,255,.05); }
.pmp-share-wa  { background: rgba(37,211,102,.1); border-color: rgba(37,211,102,.3); color: #4ade80; }
.pmp-share-wa:hover  { background: rgba(37,211,102,.2); }
.pmp-share-stories { background: rgba(201,150,62,.1); border-color: rgba(201,150,62,.3); color: #e8b96a; }
.pmp-share-stories:hover { background: rgba(201,150,62,.2); }

/* CTA buttons */
.pmp-mcta {
  display: block; padding: 11px 20px; border-radius: 8px;
  text-align: center; font-size: 12px; font-weight: 700;
  letter-spacing: .08em; text-transform: uppercase; text-decoration: none;
  transition: all .15s;
}
.pmp-mcta-primary {
  background: var(--gold, #c9963e); color: #080706;
}
.pmp-mcta-primary:hover { opacity: .9; }
.pmp-mcta-ghost {
  background: transparent; color: var(--mu);
  border: 1px solid var(--bd2);
}
.pmp-mcta-ghost:hover { color: var(--tx); border-color: var(--bd2); }

/* Empty panel */
.pmp-mp-empty-panel {
  height: 100%; display: flex;
  align-items: center; justify-content: center; padding: 32px;
}
.pmp-mp-empty-inner {
  text-align: center; display: flex;
  flex-direction: column; gap: 12px; align-items: center;
}
.pmp-mp-empty-icon {
  font-size: 32px; color: rgba(201,150,62,.4);
  animation: pm-idle-pulse 2s ease-in-out infinite alternate;
}
.pmp-mp-empty-msg {
  font-family: 'Cormorant Garamond', Georgia, serif;
  font-size: 20px; font-weight: 700; color: var(--tx); margin: 0;
}
.pmp-mp-empty-sub { font-size: 13px; color: var(--mu); margin: 0; line-height: 1.5; }

/* Override wrap padding on moment page */
.pmp-wrap.pmp-moment-wrap { padding: 0; max-width: none; }

/* Fullscreen */
:fullscreen .pmp-mp-fs-btn,
:-webkit-full-screen .pmp-mp-fs-btn { top: 8px; right: 8px; }

/* Mobile */
@media(max-width: 640px) {
  .pmp-mp-panel { padding: 72px 12px 12px; }
  .pmp-mp-panel-inner { max-height: calc(100vh - 90px); }
  .pmp-mcard-quote { font-size: 16px; }
  .pmp-mp-fs-btn { display: none; }
}
/* ── POST-PURCHASE SUCCESS BLOCK ──────────────────────────────── */
.pmp-success-block {
  margin: 0; padding: 20px 24px;
  border-bottom: 1px solid var(--bd);
  display: flex; flex-direction: column; gap: 14px;
}

.pmp-success-header {
  display: flex; align-items: flex-start; gap: 12px;
}
.pmp-success-icon { font-size: 28px; line-height: 1; flex-shrink: 0; }
.pmp-success-title {
  font-family: 'Cormorant Garamond', 'Cormorant', Georgia, serif;
  font-size: 18px; font-weight: 700; color: var(--tx);
  margin-bottom: 3px;
}
.pmp-success-sub { font-size: 12px; color: var(--mu); }

.pmp-validation-box {
  display: flex; align-items: flex-start; gap: 10px;
  background: rgba(201,150,62,.07);
  border: 1px solid rgba(201,150,62,.25);
  border-radius: 8px; padding: 12px 14px;
}
.pmp-validation-icon { font-size: 16px; flex-shrink: 0; margin-top: 1px; }
.pmp-validation-title {
  font-size: 12px; font-weight: 700; color: #c9963e; margin-bottom: 4px;
}
.pmp-validation-text {
  font-size: 11px; color: var(--mu); line-height: 1.6;
}
.pmp-validation-text a { color: #c9963e; text-decoration: underline; }

.pmp-save-url-box {
  background: var(--s2); border: 1px solid var(--bd);
  border-radius: 8px; padding: 12px 14px;
}
.pmp-save-url-label {
  font-size: 11px; font-weight: 700; color: var(--mu);
  text-transform: uppercase; letter-spacing: .04em; margin-bottom: 8px;
}
.pmp-save-url-row { display: flex; gap: 6px; }
.pmp-save-url-input {
  flex: 1; background: var(--bg); border: 1px solid var(--bd2);
  border-radius: 6px; padding: 7px 10px;
  font-size: 11px; font-family: monospace; color: var(--tx);
  outline: none;
}
.pmp-save-url-btn {
  display: flex; align-items: center; gap: 5px;
  background: var(--gold, #c9963e); color: #080706;
  border: none; border-radius: 6px; padding: 7px 12px;
  font-size: 11px; font-weight: 700; cursor: pointer; white-space: nowrap;
  transition: opacity .15s;
}
.pmp-save-url-btn:hover { opacity: .85; }

.pmp-success-contact {
  font-size: 11px; color: var(--mu); text-align: center;
  padding-top: 4px;
}
/* ── PREVIEW GRID (grille de présentation) ──────────────────────── */
.pm-preview-wrap {
  position: relative;
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 24px;
}

.pm-preview-grid-inner {
  position: relative;
  width: 100%;
  max-width: 700px;
  aspect-ratio: 1 / 1;
  border-radius: 6px;
  overflow: hidden;
  box-shadow: 0 0 60px rgba(201,150,62,0.15);
}

#pm-preview-canvas,
#pm-preview-overlay {
  position: absolute;
  top: 0; left: 0;
  width: 100%; height: 100%;
}

#pm-preview-canvas  { z-index: 1; }
#pm-preview-overlay { z-index: 2; }

/* Subtle "clickable" overlay hint */
.pm-preview-grid-inner::after {
  content: '';
  position: absolute;
  inset: 0;
  z-index: 3;
  pointer-events: none;
  border: 1px solid rgba(201,150,62,0.2);
  border-radius: 6px;
  transition: border-color 0.3s;
}
.pm-preview-grid-inner:hover::after {
  border-color: rgba(201,150,62,0.5);
}

/* CTA below the grid */
.pm-preview-cta-wrap {
  text-align: center;
}
.pm-preview-cta {
  display: inline-block;
  padding: 14px 36px;
  background: transparent;
  border: 1px solid #c9963e;
  color: #c9963e;
  font-family: 'DM Mono', monospace;
  font-size: 13px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  text-decoration: none;
  border-radius: 3px;
  transition: background 0.25s, color 0.25s;
}
.pm-preview-cta:hover {
  background: #c9963e;
  color: #080706;
}

/* ── SHOWCASE BAR ───────────────────────────────────────────────── */
.pmp-showcase-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 10px 24px;
  background: rgba(8,7,6,.9);
  border-bottom: 1px solid rgba(201,150,62,0.2);
  font-family: 'DM Mono', monospace;
  font-size: 11px;
  color: rgba(201,150,62,0.7);
  letter-spacing: 0.05em;
  position: fixed;
  top: 0; left: 0; right: 0;
  z-index: 50;
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  height: 44px;
  box-sizing: border-box;
}
.pmp-showcase-bar-dot {
  color: #c9963e;
  margin-right: 8px;
  animation: pmp-pulse-dot 2.5s ease-in-out infinite;
}
@keyframes pmp-pulse-dot {
  0%, 100% { opacity: 1; }
  50%       { opacity: 0.3; }
}
.pmp-showcase-bar-text {
  display: flex;
  align-items: center;
  white-space: nowrap;
}
.pmp-showcase-bar-cta {
  display: inline-block;
  padding: 8px 20px;
  background: #c9963e;
  color: #080706;
  font-family: 'DM Mono', monospace;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  text-decoration: none;
  border-radius: 3px;
  white-space: nowrap;
  transition: background 0.2s, transform 0.15s;
}
.pmp-showcase-bar-cta:hover {
  background: #e8b96a;
  transform: translateY(-1px);
}

/* ── PANEL CTA UPGRADES ─────────────────────────────────────────── */
.pmp-mcta-primary {
  display: block;
  text-align: center;
  padding: 14px 24px;
  background: #c9963e;
  color: #080706 !important;
  font-family: 'DM Mono', monospace;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  text-decoration: none;
  border-radius: 3px;
  transition: background 0.2s, transform 0.15s;
  border: none;
}
.pmp-mcta-primary:hover {
  background: #e8b96a;
  transform: translateY(-1px);
}
.pmp-mcta-ghost {
  display: block;
  text-align: center;
  padding: 8px;
  color: rgba(201,150,62,0.5) !important;
  font-family: 'DM Mono', monospace;
  font-size: 11px;
  text-decoration: none;
  transition: color 0.2s;
  border: none;
  background: none;
}
.pmp-mcta-ghost:hover {
  color: #c9963e !important;
}

@media (max-width: 480px) {
  .pmp-showcase-bar { flex-direction: column; gap: 8px; padding: 10px 16px; text-align: center; }
  .pmp-showcase-bar-cta { width: 100%; text-align: center; }
}

/* ── MOMENT BANNER (above purchase grid) ────────────────────────── */
.pm-moment-banner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 11px 20px;
  margin: 0 0 0 0;
  background: rgba(201,150,62,0.06);
  border: 1px solid rgba(201,150,62,0.2);
  border-left: 3px solid #c9963e;
  border-radius: 0 4px 4px 0;
  text-decoration: none;
  cursor: pointer;
  transition: background 0.2s, border-color 0.2s;
}
.pm-moment-banner:hover {
  background: rgba(201,150,62,0.12);
  border-color: rgba(201,150,62,0.45);
}
.pm-moment-banner-pulse {
  display: inline-block;
  width: 7px; height: 7px;
  border-radius: 50%;
  background: #c9963e;
  flex-shrink: 0;
  animation: pm-banner-pulse 2s ease-in-out infinite;
}
@keyframes pm-banner-pulse {
  0%, 100% { opacity: 1; transform: scale(1); }
  50%       { opacity: 0.4; transform: scale(0.7); }
}
.pm-moment-banner-text {
  flex: 1;
  font-family: 'DM Mono', monospace;
  font-size: 12px;
  color: rgba(201,150,62,0.75);
  letter-spacing: 0.03em;
}
.pm-moment-banner-text em {
  font-style: normal;
  color: rgba(201,150,62,0.5);
  margin-left: 4px;
}
.pm-moment-banner-cta {
  font-family: 'DM Mono', monospace;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #c9963e;
  white-space: nowrap;
  padding: 5px 14px;
  border: 1px solid rgba(201,150,62,0.35);
  border-radius: 3px;
  transition: background 0.2s, color 0.2s;
}
.pm-moment-banner:hover .pm-moment-banner-cta {
  background: #c9963e;
  color: #080706;
}
@media (max-width: 640px) {
  .pm-moment-banner { flex-wrap: wrap; }
  .pm-moment-banner-cta { display: none; }
}

/* ── SHARE SECTION (page /moment) ──────────────────────────────── */
.pmp-mshare {
  padding: 0 24px 20px;
}
.pmp-mshare-label {
  font-family: 'DM Mono', monospace;
  font-size: 10px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--mu);
  margin-bottom: 10px;
}
.pmp-mshare-btns {
  display: flex;
  flex-direction: column;
  gap: 7px;
}
.pmp-share-btn {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 9px 14px;
  border-radius: 4px;
  font-family: 'DM Mono', monospace;
  font-size: 12px;
  letter-spacing: 0.04em;
  text-decoration: none;
  cursor: pointer;
  transition: background 0.18s, border-color 0.18s;
  border: 1px solid var(--bd);
  background: var(--s1);
  color: var(--tx);
  width: 100%;
  text-align: left;
}
.pmp-share-btn:hover { background: var(--s2); border-color: var(--bd2); }
.pmp-share-btn svg { flex-shrink: 0; opacity: 0.8; }
.pmp-share-tw { color: var(--tx) !important; }
.pmp-share-fb svg { color: #1877F2; }
.pmp-share-wa svg { color: #25D366; }
.pmp-share-copy svg { color: #c9963e; }
.pmp-share-stories svg { color: #c9963e; }
.pmp-share-stories { cursor: pointer; border: none; background: var(--s2); }