/* =========================================================================
   AANGAN · THE PHOTO WALL — a player's profile becomes the baithak gallery
   -------------------------------------------------------------------------
   Owner 2026-08-27: tapping a player's name should walk you up to their
   photo wall — everything they're proud of, FRAMED. A single garlanded
   portrait reads as a memorial (a shraddh photo); a wall of many frames reads
   as a living family gallery, which is what every desi drawing room has.

   This is a SKIN over the existing profile overlay (32-profile.js pfRender):
   the panel becomes a papered wall with a picture rail, and the hero + each
   section become hung frames (teak + gold, cream mount, a nail on top). No
   markup, id or listener changes — the deck-fan flip, the mat unroll, the
   group-admin buttons and the shop funnel all keep working untouched. Loaded
   after every profile rule so it reskins without editing them.
   Scoped to #profileOv only — cannot reach anything else.
   ========================================================================= */

#profileOv{ --pw-wall-1:#c99a63; --pw-wall-2:#a9793f; --pw-ink:#4a3313; --pw-ink2:#6b4a1e;
  --pw-title:#8a3f1e; --pw-gold:#caa040; --pw-frame-1:#8a5a2c; --pw-frame-2:#6d4420; }

/* the papered baithak wall behind the frames */
#profileOv .panel{
  background:
    repeating-linear-gradient(92deg,rgba(255,240,210,.05) 0 2px,transparent 2px 9px),
    radial-gradient(130% 60% at 50% 0,var(--pw-wall-1),var(--pw-wall-2) 62%,#7c5330) !important;
}
#profileOv #pfBody{position:relative;padding:14px 13px 16px}
/* the picture rail the frames hang from */
#profileOv #pfBody::before{content:"";position:sticky;top:0;display:block;height:11px;margin:-14px -13px 12px;
  z-index:6;background:linear-gradient(180deg,#7a4f28,#5f3a1e 55%,#432712);
  box-shadow:inset 0 1px 0 rgba(255,224,168,.4),0 3px 5px rgba(0,0,0,.3)}

/* ---- the hero → a big hung portrait frame ---- */
#profileOv .pfhero{
  border-radius:5px !important;height:210px !important;margin:0 2px 20px;position:relative;
  border:7px solid transparent;
  background-clip:padding-box;
  box-shadow:0 0 0 2px var(--pw-gold),0 0 0 9px #5a3717,0 9px 20px rgba(0,0,0,.5) !important;
  border-image:linear-gradient(135deg,#8a5a2c,#6d4420 45%,#8a5a2c) 7 !important;
}
/* the nail it hangs from */
#profileOv .pfhero::after{content:"";position:absolute;left:50%;top:-15px;transform:translateX(-50%);
  width:7px;height:7px;border-radius:50%;z-index:8;
  background:radial-gradient(circle at 38% 32%,#fff2c6,#c99a3c 55%,#8a5f14);box-shadow:0 2px 3px rgba(0,0,0,.4)}

/* ---- each section → a hung cream frame ---- */
#profileOv .pfsects{padding:0 2px;display:flex;flex-direction:column;gap:20px}
#profileOv .pfsect{position:relative;margin:0;padding:13px 13px 14px;border-radius:4px;
  background:linear-gradient(180deg,#f5ecd6,#e8d9ba);
  box-shadow:inset 0 0 0 2px var(--pw-gold),inset 0 0 0 4px #5a3717,0 7px 14px rgba(0,0,0,.42)}
#profileOv .pfsect::after{content:"";position:absolute;left:50%;top:-13px;transform:translateX(-50%);
  width:7px;height:7px;border-radius:50%;z-index:2;
  background:radial-gradient(circle at 38% 32%,#fff2c6,#c99a3c 55%,#8a5f14);box-shadow:0 2px 3px rgba(0,0,0,.4)}
/* the section label sits on the cream mount, no chalk rules */
#profileOv .pfsect h4{color:var(--pw-title) !important;font-family:var(--ck-disp);margin:0 0 10px !important;
  justify-content:flex-start !important}
#profileOv .pfsect h4::before,#profileOv .pfsect h4::after{content:none !important}
/* text on the cream mount is ink */
#profileOv .pfsect .pfrec,#profileOv .pfsect .pflabel,#profileOv .pfsect .muted,
#profileOv .pfsect .pfach-line{color:var(--pw-ink2) !important}
#profileOv .pfsect .pflabel b{color:var(--pw-ink) !important}
#profileOv .pftile{background:rgba(120,85,30,.10) !important;box-shadow:inset 0 0 0 1px rgba(120,85,30,.25) !important}
#profileOv .pftile b{color:var(--pw-title) !important}
#profileOv .pftile span{color:var(--pw-ink2) !important}
/* the overall-tier bar → a slimmer marble-gold fill on the cream (the long
   grey bar looked foreign on paper; keep it, just warm it) */
#profileOv .pfbar{height:7px;border-radius:99px;background:rgba(120,85,30,.18) !important}
#profileOv .pfbar i{background:linear-gradient(90deg,#e6bd5c,#c9982e) !important}

/* the mats chips row keeps working (mat unroll) — lift it clear of the frame edge */
#profileOv .pfmats{right:10px;bottom:10px}
/* close button stays above the rail */
#profileOv #pfClose{z-index:9}