/*


/* ============================================================================
   2026-09-29 — PREMIUM FRAME EXPERIENCE LAYER
   Additive only. Adds: photographed card previews on the storefront, craft-time
   strip, gold spec sheet, "lasts forever" block, gallery zoom/lightbox and the
   mobile sticky buy bar. Nothing above this line was changed.
   ============================================================================ */

/* ---- Storefront cards: real sample photo instead of a bare emoji plate ---- */
#portrait-frames .frame-shot{
  position:relative;height:210px;overflow:hidden;
  background:#12110f;border-bottom:1px solid var(--line,#2A2925);
}
#portrait-frames .frame-shot img{
  width:100%;height:100%;object-fit:cover;display:block;
  transform:scale(1.02);transition:transform .5s ease;
}
#portrait-frames .frame-card:hover .frame-shot img{transform:scale(1.07);}
#portrait-frames .frame-shot::after{
  content:'';position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(0,0,0,0) 45%,rgba(8,7,5,.72) 100%);
}
#portrait-frames .frame-lead{
  position:absolute;left:12px;bottom:10px;z-index:2;
  font-family:'Space Mono',monospace;font-size:10px;letter-spacing:.4px;
  color:var(--white,#F5F5F0);background:rgba(10,9,7,.62);
  border:1px solid rgba(245,200,66,.30);border-radius:999px;padding:4px 10px;
  backdrop-filter:blur(4px);
}
#portrait-frames .frame-card{position:relative;}

/* ---- Craft-time promise strip (detail page) ------------------------------ */
.fd-craft{
  display:flex;gap:12px;align-items:flex-start;
  padding:13px 15px;margin:0 0 20px;border-radius:14px;
  background:linear-gradient(135deg,rgba(212,160,23,.10),rgba(212,160,23,.03));
  border:1px solid rgba(212,160,23,.32);
}
.fd-craft.handmade{
  background:linear-gradient(135deg,rgba(255,77,46,.12),rgba(255,77,46,.03));
  border-color:rgba(255,77,46,.34);
}
.fd-craft-icon{font-size:20px;line-height:1.2;}
.fd-craft b{display:block;font-size:13.5px;color:var(--white,#F5F5F0);margin-bottom:3px;}
.fd-craft span{display:block;font-size:12.5px;color:var(--grey,#9C9890);line-height:1.55;}
.fd-craft span b{display:inline;color:var(--gold-light,#F5C842);}

/* ---- Hero gallery: watermark tag, zoom button, fade, lightbox ------------ */
.fd-hero{position:relative;}
.fd-hero img{cursor:zoom-in;}
.fd-hero-mark{
  position:absolute;top:12px;left:12px;
  font-family:'Space Mono',monospace;font-size:9.5px;letter-spacing:2px;
  color:rgba(255,255,255,.78);background:rgba(10,9,7,.5);
  border-radius:999px;padding:4px 10px;pointer-events:none;
}
.fd-zoom{
  position:absolute;right:12px;bottom:12px;width:36px;height:36px;border-radius:50%;
  border:1px solid rgba(245,200,66,.35);background:rgba(10,9,7,.6);color:var(--gold-light,#F5C842);
  font-size:15px;cursor:pointer;backdrop-filter:blur(4px);transition:transform .15s,background .15s;
}
.fd-zoom:hover{transform:scale(1.08);background:rgba(10,9,7,.85);}
@keyframes fdFade{from{opacity:.25;transform:scale(1.01);}to{opacity:1;transform:none;}}
.fd-fade{animation:fdFade .35s ease;}
.fd-thumbs .thumb{transition:transform .15s,border-color .15s;}
.fd-thumbs .thumb:hover{transform:translateY(-2px);border-color:rgba(245,200,66,.55);}
.fd-lightbox{
  position:fixed;inset:0;z-index:1400;display:none;align-items:center;justify-content:center;
  background:rgba(6,5,4,.92);padding:28px;
}
.fd-lightbox.show{display:flex;}
.fd-lightbox img{max-width:min(92vw,760px);max-height:90vh;border-radius:10px;box-shadow:0 30px 80px rgba(0,0,0,.6);}
.fd-lightbox-x{
  position:absolute;top:18px;right:22px;width:42px;height:42px;border-radius:50%;
  border:1px solid var(--line,#2A2925);background:rgba(20,18,15,.9);color:var(--white,#F5F5F0);
  font-size:24px;line-height:1;cursor:pointer;
}

/* ---- Spec sheet ---------------------------------------------------------- */
.fd-spec-row{
  display:flex;justify-content:space-between;gap:14px;margin-top:10px;padding-top:10px;
  border-top:1px dashed rgba(245,200,66,.22);font-size:12.5px;
}
.fd-spec-row span{color:var(--grey,#9C9890);}
.fd-spec-row b{color:var(--gold-light,#F5C842);font-weight:700;text-align:right;}

/* ---- "It lasts forever" block (Leaf Art) --------------------------------- */
.fd-forever{
  position:relative;overflow:hidden;margin-top:16px;padding:20px 20px 18px;border-radius:16px;
  background:linear-gradient(160deg,rgba(57,195,110,.10),rgba(20,20,18,.6));
  border:1px solid rgba(57,195,110,.30);
}
.fd-forever-glow{
  position:absolute;inset:auto -40px -70px auto;width:220px;height:220px;border-radius:50%;
  background:radial-gradient(circle,rgba(57,195,110,.28),transparent 68%);pointer-events:none;
}
.fd-forever-badge{
  display:inline-block;font-family:'Space Mono',monospace;font-size:10px;letter-spacing:1.4px;
  text-transform:uppercase;color:#0f1a12;background:linear-gradient(135deg,#7BE0A3,#39C36E);
  border-radius:999px;padding:5px 11px;margin-bottom:10px;
}
.fd-forever h3{
  font-family:'Bebas Neue',sans-serif;font-size:24px;letter-spacing:.6px;
  color:var(--white,#F5F5F0);margin:0 0 8px;
}
.fd-forever p{font-size:13px;line-height:1.65;color:var(--grey,#9C9890);margin:0 0 12px;}
.fd-forever ul{list-style:none;margin:0;padding:0;display:grid;gap:8px;}
.fd-forever li{
  position:relative;padding-left:22px;font-size:12.8px;line-height:1.5;color:var(--white,#F5F5F0);
}
.fd-forever li::before{content:'\2713';position:absolute;left:0;top:0;color:#39C36E;font-weight:700;}

/* ---- Locked (Digital-only) field ----------------------------------------- */
.fgrp-locked select.fx{opacity:.55;cursor:not-allowed;}
.fgrp-locked .fl{opacity:.8;}

/* ---- Sticky mobile buy bar ----------------------------------------------- */
.fd-sticky{display:none;}
@media(max-width:880px){
  .fd-sticky{
    display:flex;position:fixed;left:0;right:0;bottom:0;z-index:1100;
    align-items:center;gap:12px;padding:11px 16px calc(11px + env(safe-area-inset-bottom));
    background:rgba(14,13,11,.94);border-top:1px solid var(--line,#2A2925);
    backdrop-filter:blur(10px);
  }
  .fd-sticky-l{display:flex;flex-direction:column;min-width:0;flex:1;}
  .fd-sticky-name{
    font-size:13px;font-weight:700;color:var(--white,#F5F5F0);
    white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  }
  .fd-sticky-cfg{font-size:11px;color:var(--grey,#9C9890);}
  .fd-sticky-btn{
    flex:0 0 auto;padding:12px 20px;border:none;border-radius:50px;
    background:var(--coral,#FF4D2E);color:#fff;font-weight:700;font-size:14.5px;cursor:pointer;
  }
  #frame-detail{padding-bottom:104px;}
}

/* ---- Success modal eta line ---------------------------------------------- */
#fd-suc-eta{
  display:block;margin:-8px 0 16px;font-size:12.5px;color:var(--gold-light,#F5C842);
}


/* ============================================================================
   2026-09-29 (b) — "A STAR IN THEIR NAME" registry layer
   Additive only. Scoped to the star product via .fd-registry / .fd-includes /
   .fd-honest, so no other frame is affected.
   ============================================================================ */

/* Ambient starfield behind the buy column, registry product only. */
.fd-info.fd-registry{position:relative;}
.fd-registry .fd-sky{
  position:absolute;inset:-20px -14px auto -14px;height:420px;z-index:0;pointer-events:none;
  border-radius:20px;opacity:.85;
  background:
    radial-gradient(1.4px 1.4px at 12% 18%, rgba(255,255,255,.75), transparent 60%),
    radial-gradient(1.6px 1.6px at 28% 42%, rgba(255,255,255,.55), transparent 60%),
    radial-gradient(1.2px 1.2px at 44% 12%, rgba(255,255,255,.65), transparent 60%),
    radial-gradient(1.8px 1.8px at 61% 33%, rgba(245,200,66,.85), transparent 60%),
    radial-gradient(1.3px 1.3px at 76% 16%, rgba(255,255,255,.6), transparent 60%),
    radial-gradient(1.5px 1.5px at 88% 46%, rgba(255,255,255,.5), transparent 60%),
    radial-gradient(1.2px 1.2px at 19% 62%, rgba(255,255,255,.45), transparent 60%),
    radial-gradient(1.4px 1.4px at 54% 70%, rgba(255,255,255,.4), transparent 60%),
    radial-gradient(420px 260px at 62% 12%, rgba(88,110,190,.18), transparent 70%);
}
.fd-registry > *{position:relative;z-index:1;}

/* Twinkle: one slow, non-distracting pulse. Respects reduced-motion. */
@keyframes zgTwinkle{0%,100%{opacity:.85;}50%{opacity:.55;}}
.fd-registry .fd-sky{animation:zgTwinkle 7s ease-in-out infinite;}
@media (prefers-reduced-motion: reduce){ .fd-registry .fd-sky{animation:none;} }

/* ---- "What arrives" checklist ------------------------------------------- */
.fd-includes{
  margin-top:14px;padding:16px 18px;border-radius:14px;
  background:linear-gradient(160deg,rgba(212,160,23,.09),rgba(20,20,18,.55));
  border:1px solid rgba(212,160,23,.30);
}
.fd-includes ul{list-style:none;margin:10px 0 0;padding:0;display:grid;gap:9px;}
.fd-includes li{
  position:relative;padding-left:24px;font-size:12.8px;line-height:1.55;
  color:var(--white,#F5F5F0);
}
.fd-includes li::before{
  content:'\2726';position:absolute;left:0;top:0;
  color:var(--gold-light,#F5C842);font-size:12px;
}

/* ---- Honest-by-design disclosure ---------------------------------------- */
.fd-honest{
  margin-top:14px;padding:18px 18px 16px;border-radius:14px;
  background:var(--dark3,#1F1E1C);border:1px solid var(--line,#2A2925);
}
.fd-honest-badge{
  display:inline-block;font-family:'Space Mono',monospace;font-size:10px;letter-spacing:1.4px;
  text-transform:uppercase;color:var(--gold-light,#F5C842);
  border:1px solid rgba(245,200,66,.35);border-radius:999px;padding:4px 10px;margin-bottom:10px;
}
.fd-honest h3{
  font-family:'Bebas Neue',sans-serif;font-size:21px;letter-spacing:.5px;
  color:var(--white,#F5F5F0);margin:0 0 8px;
}
.fd-honest p{font-size:12.8px;line-height:1.68;color:var(--grey,#9C9890);margin:0;}

/* ---- Registry hold status ------------------------------------------------ */
#f-hold-status.ok{color:#39C36E;}

/* ---- Storefront card: registered badge reads as a seal ------------------- */
#portrait-frames .frame-card[data-product="frame_star"] .frame-badge{
  background:linear-gradient(135deg,#F5C842,#FFF0B8);
  box-shadow:0 4px 14px rgba(245,200,66,.30);
}