/* Extracted from the pre-builder PocketParty homepage. */


:root{
  /* ---- 1. DESKTOP IMAGE  (shown on screens WIDER than 700px) ---- */
  --cat-bg-desktop: url("/storage/pocketparty/content/2026/08/ChatGPT-Image-Jul-23-2026-11_22_07-PM.png");

  /* ---- 2. MOBILE IMAGE  (shown on screens 700px and NARROWER) ---- */
  --cat-bg-mobile: url("/storage/pocketparty/content/2026/08/ChatGPT-Image-Jul-23-2026-11_22_05-PM.png");

  /* ---- 3. BRIGHTNESS  ----
     1    = original image, untouched
     2-3  = good for very dark images (current setting)
     Lower this if your new image looks washed out or too bright. */
  --cat-bg-brightness: 3.1;

  /* ---- 4. COLOUR PUNCH  ---- 1 = original, higher = more saturated */
  --cat-bg-saturate: 1.3;

  /* ---- 5. HOW MUCH THE IMAGE FADES INTO THE BLACK ABOVE / BELOW ----
     First number = fade-in from the top. Second = where the fade-out starts.
     Set to  0%  and  100%  for hard edges with no fade. */
  --cat-bg-fade-top: 13%;
  --cat-bg-fade-bottom: 85%;
}



:root{
--void:#03060D;
--void-2:#010309;
--panel:#0A1120;
--panel-2:#111B31;
--edge:rgba(255,214,0,.20);
--edge-soft:rgba(160,180,220,.13);
--ink:#EAF1FF;
--muted:#7C8AA8;
--prime:#FFD600;
--prime-deep:#A88400;
--volt:#2E9BFF;
--cyan:#22E3FF;
--gold:#FFD600;
--flame:#FF3B3B;
--teal:#12E0C0;
--violet:#A96BFF;

--maxw:1240px;
--r:4px;
color-scheme:dark;
}
*,*::before,*::after{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;}
body{
margin:0;
background:var(--void);
color:var(--ink);
font-family:"Rubik",system-ui,-apple-system,"Segoe UI",sans-serif;
font-size:16px;
line-height:1.6;
overflow-x:hidden;
}
img{max-width:100%;display:block;}
a{color:inherit;text-decoration:none;}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer;}
:focus-visible{outline:2px solid var(--volt);outline-offset:3px;}
.pp-wrap{width:100%;max-width:var(--maxw);margin:0 auto;padding:0 24px;}
.pp-display{
font-family:"Chango","Rubik",sans-serif;
font-weight:400;
line-height:.92;
letter-spacing:.01em;
text-transform:uppercase;
text-wrap:balance;
}
.pp-eyebrow{
font-family:"Bungee","Rubik",sans-serif;
font-size:11px;
letter-spacing:.22em;
text-transform:uppercase;
color:var(--prime);
}
.pp-badge{
font-family:"Bungee","Rubik",sans-serif;
font-size:10px;
letter-spacing:.16em;
text-transform:uppercase;
}
.pp-lede{color:var(--muted);font-size:17px;max-width:56ch;}
.pp-num{font-variant-numeric:tabular-nums;}
.pp-outline{
color:var(--prime);
-webkit-text-stroke:3px #061024;
paint-order:stroke fill;
text-shadow:0 4px 0 #061024, 0 8px 0 rgba(46,155,255,.75), 0 14px 30px rgba(46,155,255,.35);
}
.pp-outline-leaf{
color:var(--volt);
-webkit-text-stroke:3px #061024;
paint-order:stroke fill;
text-shadow:0 4px 0 #061024, 0 8px 0 rgba(255,214,0,.7), 0 14px 30px rgba(255,214,0,.22);
}
.pp-tex{position:relative;isolation:isolate;}
.pp-tex::before{
content:"";position:absolute;inset:0;z-index:0;pointer-events:none;
background-image:radial-gradient(rgba(255,214,0,.18) 1px, transparent 1px);
background-size:22px 22px;
-webkit-mask-image:radial-gradient(120% 80% at 50% 0%, #000 0%, transparent 72%);
mask-image:radial-gradient(120% 80% at 50% 0%, #000 0%, transparent 72%);
opacity:.55;
}
.pp-tex > *{position:relative;z-index:1;}
.pp-btn{
display:inline-flex;align-items:center;gap:10px;
font-family:"Bungee","Rubik",sans-serif;
font-size:12px;letter-spacing:.14em;text-transform:uppercase;
padding:16px 26px;
border:2px solid transparent;
clip-path:polygon(10px 0,100% 0,100% calc(100% - 10px),calc(100% - 10px) 100%,0 100%,0 10px);
transition:transform .16s ease, box-shadow .16s ease, background .16s ease;
will-change:transform;
}
.pp-btn:hover{transform:translate(-2px,-2px);}
.pp-btn--primary{background:var(--prime);color:#141000;box-shadow:4px 4px 0 var(--prime-deep);}
.pp-btn--primary:hover{box-shadow:7px 7px 0 var(--prime-deep);}
.pp-btn--volt{background:var(--volt);color:#00101F;box-shadow:4px 4px 0 #12557F;}
.pp-btn--volt:hover{box-shadow:7px 7px 0 #12557F;}
.pp-btn--ghost{border-color:rgba(232,240,255,.28);color:var(--ink);}
.pp-btn--ghost:hover{border-color:var(--volt);color:var(--volt);box-shadow:4px 4px 0 rgba(46,155,255,.35);}
.pp-btn--dark{background:#0A1020;color:var(--ink);box-shadow:4px 4px 0 rgba(46,155,255,.55);}
.pp-section{padding:84px 0;position:relative;}
.pp-section--tight{padding:52px 0;}
.pp-rule{height:1px;background:linear-gradient(90deg,transparent,var(--edge) 18%,var(--edge) 82%,transparent);}
.pp-head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:24px;margin-bottom:40px;}
.pp-head h2{margin:10px 0 0;font-size:clamp(30px,4vw,46px);}
.pp-head p{margin:12px 0 0;}
.pp-marquee{overflow:hidden;border-block:1px solid var(--edge);background:var(--void-2);}
.pp-marquee__track{display:flex;width:max-content;animation:pp-slide 34s linear infinite;}
.pp-marquee__group{display:flex;align-items:center;gap:44px;padding:11px 22px;flex:none;}
.pp-marquee span{
font-family:"Bungee","Rubik",sans-serif;font-size:11px;letter-spacing:.18em;
text-transform:uppercase;color:var(--muted);white-space:nowrap;display:flex;align-items:center;gap:10px;
}
.pp-marquee span b{color:var(--prime);font-weight:400;}
.pp-dot{width:5px;height:5px;background:var(--volt);flex:none;transform:rotate(45deg);}
@keyframes pp-slide{from{transform:translateX(0);}to{transform:translateX(-50%);}}
.pp-header{
position:sticky;top:0;z-index:60;
background:rgba(6,10,18,.86);
backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
border-bottom:1px solid var(--edge);
}
.pp-header__in{display:flex;align-items:center;gap:28px;height:74px;}
.pp-logo{display:flex;align-items:baseline;gap:2px;font-family:"Chango",sans-serif;font-size:24px;text-transform:uppercase;letter-spacing:.01em;flex:none;}
.pp-logo i{font-style:normal;color:var(--gold);-webkit-text-stroke:1.5px #0A1020;paint-order:stroke fill;}
.pp-logo em{font-style:normal;color:var(--prime);-webkit-text-stroke:1.5px #06120A;paint-order:stroke fill;}
.pp-nav{display:flex;align-items:center;gap:26px;margin-left:6px;}
.pp-nav a{
font-family:"Bungee","Rubik",sans-serif;font-size:11px;letter-spacing:.13em;
text-transform:uppercase;color:var(--muted);padding:6px 0;border-bottom:2px solid transparent;
transition:color .15s ease,border-color .15s ease;white-space:nowrap;
}
.pp-nav a:hover{color:var(--ink);border-color:var(--prime);}
.pp-header__act{display:flex;align-items:center;gap:14px;margin-left:auto;flex:none;}
.pp-agechip{
display:flex;align-items:center;gap:7px;padding:7px 12px;border:1px solid var(--edge-soft);
font-family:"Bungee",sans-serif;font-size:10px;letter-spacing:.12em;color:var(--muted);
}
.pp-agechip b{color:var(--prime);font-weight:400;}
.pp-icon{width:20px;height:20px;stroke:currentColor;fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;}
.pp-iconbtn{display:grid;place-items:center;width:40px;height:40px;color:var(--muted);border:1px solid transparent;transition:color .15s,border-color .15s;}
.pp-iconbtn:hover{color:var(--prime);border-color:var(--edge);}
.pp-cartcount{
position:absolute;transform:translate(12px,-12px);background:var(--flame);color:#1A0000;
font-family:"Bungee",sans-serif;font-size:9px;min-width:17px;height:17px;display:grid;place-items:center;
}
.pp-burger{display:none;}
.pp-hero{
position:relative;overflow:hidden;
background:
radial-gradient(78% 66% at 76% 46%, rgba(46,155,255,.30), transparent 64%),
radial-gradient(64% 56% at 10% 74%, rgba(255,214,0,.13), transparent 68%),
linear-gradient(180deg,#050A16 0%, #02040A 100%);
border-bottom:1px solid var(--edge);
}
.pp-hero::after{
content:"";position:absolute;inset:0;pointer-events:none;
background-image:radial-gradient(rgba(232,240,255,.09) 1px, transparent 1px);
background-size:26px 26px;
-webkit-mask-image:linear-gradient(180deg,#000,transparent 78%);
mask-image:linear-gradient(180deg,#000,transparent 78%);
}
.pp-hero__in{
position:relative;z-index:2;display:grid;grid-template-columns:1.02fr .98fr;
gap:48px;align-items:center;padding:72px 0 80px;
}
.pp-hero h1{margin:18px 0 0;font-size:clamp(38px,5.4vw,68px);max-width:12ch;}
.pp-hero h1 span{display:block;}
.pp-hero h1 .l2{font-size:1.1em;margin:.04em 0;}
.pp-hero .pp-lede{margin:26px 0 0;font-size:18px;}
.pp-hero__cta{display:flex;flex-wrap:wrap;gap:14px;margin-top:34px;}
.pp-hero__stats{display:flex;flex-wrap:wrap;gap:10px;margin-top:38px;}
.pp-stat{
border:1px solid var(--edge-soft);background:rgba(13,20,36,.7);padding:10px 14px;
display:flex;flex-direction:column;gap:2px;min-width:120px;
}
.pp-stat b{font-family:"Bungee",sans-serif;font-size:17px;color:var(--volt);font-weight:400;}
.pp-stat span{font-family:"Bungee",sans-serif;font-size:9px;letter-spacing:.14em;color:var(--muted);}
.pp-hero__art{position:relative;aspect-ratio:1/1;display:grid;place-items:center;}
.pp-hero__ring{
position:absolute;inset:6%;border:1px dashed rgba(41,216,255,.3);border-radius:50%;
animation:pp-spin 44s linear infinite;
}
.pp-hero__ring:nth-child(2){inset:16%;border-color:rgba(46,155,255,.28);animation-duration:32s;animation-direction:reverse;}
@keyframes pp-spin{to{transform:rotate(360deg);}}
.pp-artslot{
position:relative;width:78%;aspect-ratio:1/1;display:grid;place-items:center;text-align:center;gap:6px;
background:
radial-gradient(60% 60% at 50% 45%, rgba(46,155,255,.20), transparent 70%),
repeating-linear-gradient(135deg,rgba(232,240,255,.05) 0 10px,transparent 10px 20px),
var(--panel);
border:2px dashed rgba(232,240,255,.22);
clip-path:polygon(16% 0,100% 0,100% 84%,84% 100%,0 100%,0 16%);
}
.pp-artslot p{margin:0;font-family:"Bungee",sans-serif;font-size:11px;letter-spacing:.15em;color:var(--muted);padding:0 24px;line-height:1.9;}
.pp-artslot p b{display:block;color:var(--prime);font-size:14px;font-weight:400;margin-bottom:6px;}
.pp-trust{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid var(--edge);background:var(--panel);}
.pp-trust > div{padding:24px 22px;border-right:1px solid var(--edge);display:flex;gap:14px;align-items:center;}
.pp-trust__txt{min-width:0;flex:1;}
.pp-trust > div:last-child{border-right:0;}
.pp-trust img{width:42px;height:42px;flex:none;object-fit:contain;}
.pp-trust h3{margin:0 0 3px;font-family:"Bungee",sans-serif;font-size:10.5px;letter-spacing:.11em;font-weight:400;white-space:nowrap;}
.pp-trust p{margin:0;font-size:13.5px;color:var(--muted);line-height:1.5;}
.pp-cats{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;}
.pp-cat{
position:relative;display:flex;flex-direction:column;justify-content:flex-end;gap:6px;
min-height:230px;padding:24px;background:var(--panel);border:1px solid var(--edge-soft);
clip-path:polygon(0 0,100% 0,100% calc(100% - 18px),calc(100% - 18px) 100%,0 100%);
transition:transform .18s ease,border-color .18s ease,background .18s ease;
overflow:hidden;
}
.pp-cat::before{
content:"";position:absolute;inset:0;opacity:.5;
background:radial-gradient(75% 70% at 80% 12%, var(--glow,rgba(46,155,255,.28)), transparent 68%);
transition:opacity .18s ease;
}
.pp-cat:hover{transform:translateY(-5px);border-color:var(--edge);background:var(--panel-2);}
.pp-cat:hover::before{opacity:.95;}
.pp-cat__ic{position:relative;width:44px;height:44px;display:grid;place-items:center;border:1px solid var(--edge-soft);margin-bottom:auto;}
.pp-cat__ic svg{width:22px;height:22px;stroke:var(--accent,var(--prime));fill:none;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;}
.pp-cat h3{position:relative;margin:0;font-family:"Chango",sans-serif;font-size:27px;text-transform:uppercase;line-height:1;}
.pp-cat p{position:relative;margin:0;font-size:13.5px;color:var(--muted);}
.pp-cat__go{
position:relative;margin-top:12px;font-family:"Bungee",sans-serif;font-size:10px;letter-spacing:.14em;
color:var(--accent,var(--prime));display:flex;align-items:center;gap:8px;
}
.pp-cat__go svg{width:14px;height:14px;stroke:currentColor;fill:none;stroke-width:2;transition:transform .18s ease;}
.pp-cat:hover .pp-cat__go svg{transform:translateX(5px);}
.pp-deck{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;}
.pp-card{
position:relative;padding:12px;background:var(--frame,linear-gradient(160deg,#1B2440,#0B1120));
border:1px solid var(--tier,var(--prime));
clip-path:polygon(20px 0,100% 0,100% calc(100% - 20px),calc(100% - 20px) 100%,0 100%,0 20px);
transition:transform .2s ease, box-shadow .2s ease;
display:flex;flex-direction:column;
}
.pp-card:hover{transform:translateY(-8px) rotate(-.5deg);box-shadow:0 22px 44px rgba(0,0,0,.6),0 0 0 1px var(--tier,var(--prime));}
.pp-card__top{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:10px;}
.pp-card__name{font-family:"Chango",sans-serif;font-size:17px;text-transform:uppercase;line-height:1;letter-spacing:.01em;}
.pp-card__hp{font-family:"Bungee",sans-serif;font-size:12px;color:var(--tier,var(--prime));white-space:nowrap;}
.pp-card__hp small{font-size:8px;letter-spacing:.1em;color:var(--muted);margin-right:3px;}
.pp-card__art{
position:relative;aspect-ratio:4/3;display:grid;place-items:center;text-align:center;
border:2px solid rgba(0,0,0,.45);
background:
radial-gradient(70% 70% at 50% 40%, var(--tier-soft,rgba(46,155,255,.28)), transparent 72%),
repeating-linear-gradient(135deg,rgba(232,240,255,.045) 0 9px,transparent 9px 18px),
#070C16;
overflow:hidden;
}
.pp-card__art span{font-family:"Bungee",sans-serif;font-size:9.5px;letter-spacing:.14em;color:var(--muted);padding:0 14px;line-height:1.8;}
.pp-card__art span b{display:block;color:var(--tier,var(--prime));font-weight:400;font-size:11px;margin-bottom:4px;}
.pp-tierflag{
position:absolute;top:0;right:0;padding:5px 10px;background:var(--tier,var(--prime));color:#0A0800;
font-family:"Bungee",sans-serif;font-size:8.5px;letter-spacing:.14em;
clip-path:polygon(10px 0,100% 0,100% 100%,0 100%);
}
.pp-card--holo .pp-card__art::after{
content:"";position:absolute;inset:-40%;
background:linear-gradient(115deg,transparent 38%,rgba(255,255,255,.5) 47%,rgba(155,107,255,.45) 52%,transparent 62%);
animation:pp-holo 4.6s ease-in-out infinite;mix-blend-mode:screen;
}
@keyframes pp-holo{0%,100%{transform:translateX(-42%);}50%{transform:translateX(42%);}}
.pp-card__types{display:flex;flex-wrap:wrap;gap:5px;margin:10px 0 0;}
.pp-type{
font-family:"Bungee",sans-serif;font-size:8.5px;letter-spacing:.11em;padding:4px 8px;
border:1px solid currentColor;color:var(--muted);
}
.pp-type--indica{color:var(--violet);}
.pp-type--sativa{color:var(--gold);}
.pp-type--hybrid{color:var(--volt);}
.pp-stats{margin:12px 0 0;display:flex;flex-direction:column;gap:7px;}
.pp-statrow{display:grid;grid-template-columns:34px 1fr 40px;align-items:center;gap:9px;}
.pp-statrow i{font-style:normal;font-family:"Bungee",sans-serif;font-size:8px;letter-spacing:.09em;color:var(--muted);}
.pp-statrow em{font-style:normal;font-family:"Bungee",sans-serif;font-size:9.5px;color:var(--ink);text-align:right;font-variant-numeric:tabular-nums;}
.pp-bar{height:7px;background:rgba(232,240,255,.09);overflow:hidden;}
.pp-bar b{display:block;height:100%;background:var(--barc,var(--prime));}
.pp-card__foot{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:14px;padding-top:12px;border-top:1px dashed rgba(232,240,255,.16);}
.pp-price{font-family:"Bungee",sans-serif;font-size:17px;font-variant-numeric:tabular-nums;}
.pp-price s{color:var(--muted);font-size:11px;margin-left:5px;}
.pp-add{color:#141000;
font-family:"Bungee",sans-serif;font-size:9.5px;letter-spacing:.12em;padding:10px 14px;
background:var(--tier,var(--prime));
clip-path:polygon(7px 0,100% 0,100% calc(100% - 7px),calc(100% - 7px) 100%,0 100%,0 7px);
transition:transform .15s ease,filter .15s ease;
}
.pp-add:hover{transform:translateY(-2px);filter:brightness(1.12);}
.pp-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;counter-reset:s;}
.pp-step{position:relative;padding:32px 26px;background:var(--panel);border:1px solid var(--edge-soft);}
.pp-step::before{
counter-increment:s;content:"STAGE " counter(s,decimal-leading-zero);
font-family:"Bungee",sans-serif;font-size:9.5px;letter-spacing:.16em;color:#141000;
background:var(--prime);display:inline-block;padding:6px 12px;margin-bottom:18px;
clip-path:polygon(6px 0,100% 0,100% calc(100% - 6px),calc(100% - 6px) 100%,0 100%,0 6px);
}
.pp-step h3{margin:0 0 8px;font-family:"Bungee",sans-serif;font-size:13px;letter-spacing:.1em;font-weight:400;}
.pp-step p{margin:0;font-size:14.5px;color:var(--muted);}
.pp-step__line{position:absolute;top:44px;right:-11px;width:22px;height:1px;background:var(--edge);}
.pp-step:last-child .pp-step__line{display:none;}
.pp-review-actions{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:12px;}
.pp-review-arrows{display:flex;gap:8px;}
.pp-review-arrows button{display:grid;width:46px;height:46px;place-items:center;border:1px solid rgba(169,107,255,.55);background:#0b0718;color:#eaf1ff;font-size:20px;transition:border-color .15s ease,color .15s ease,background .15s ease;}
.pp-review-arrows button:hover{border-color:var(--violet);background:rgba(169,107,255,.14);color:var(--violet);}
.pp-review-arrows button.swiper-button-disabled{cursor:not-allowed;opacity:.35;}
.pp-reviews{overflow:hidden;}
.pp-reviews .swiper-wrapper{align-items:stretch;}
.pp-review{height:auto;min-height:320px;padding:34px 38px;background:var(--panel);border:1px solid var(--edge-soft);display:flex;flex-direction:column;gap:18px;}
.pp-stars{display:flex;gap:3px;}
.pp-stars svg{width:15px;height:15px;fill:var(--gold);}
.pp-review p{max-width:80ch;margin:0;font-size:17px;color:#C6D2E8;line-height:1.7;}
.pp-review footer{display:flex;align-items:center;gap:11px;margin-top:auto;padding-top:6px;}
.pp-av{width:36px;height:36px;flex:none;background:linear-gradient(140deg,var(--volt),var(--prime));display:grid;place-items:center;font-family:"Bungee",sans-serif;font-size:12px;color:#05101F;}
.pp-review footer b{display:block;font-size:13.5px;font-weight:600;}
.pp-review footer span{font-size:11.5px;color:var(--muted);}
.pp-news{
position:relative;overflow:hidden;background:var(--prime);color:#141000;
padding:76px 0;border-block:1px solid var(--prime-deep);
}
.pp-news::before{
content:"";position:absolute;inset:0;
background-image:radial-gradient(rgba(20,16,0,.18) 1.5px, transparent 1.5px);background-size:20px 20px;
}
.pp-news__in{position:relative;display:grid;grid-template-columns:1fr 1.08fr;gap:44px;align-items:center;}
.pp-news h2{margin:10px 0 0;font-size:clamp(32px,5vw,54px);color:#141000;}
.pp-news p{margin:14px 0 0;font-size:16px;color:#453800;max-width:44ch;}
.pp-news .pp-eyebrow{color:#453800;}
.pp-form{display:flex;flex-direction:column;gap:12px;}
.pp-form__row{display:flex;gap:10px;flex-wrap:wrap;}
.pp-form input{
flex:1 1 220px;padding:17px 18px;background:#0A0D14;border:2px solid #0A0D14;color:var(--ink);
font-family:"Rubik",sans-serif;font-size:15px;
clip-path:polygon(9px 0,100% 0,100% calc(100% - 9px),calc(100% - 9px) 100%,0 100%,0 9px);
}
.pp-form input::placeholder{color:#6C7690;}
.pp-form small{font-size:12px;color:#453800;line-height:1.5;max-width:52ch;}
.pp-footer{background:var(--void-2);border-top:1px solid var(--edge);padding:72px 0 0;}
.pp-footer__cols{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:40px;padding-bottom:52px;}
.pp-footer h4{margin:0 0 18px;font-family:"Bungee",sans-serif;font-size:10.5px;letter-spacing:.16em;color:var(--prime);font-weight:400;}
.pp-footer ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:11px;}
.pp-footer ul a{font-size:14px;color:var(--muted);transition:color .15s ease;}
.pp-footer ul a:hover{color:var(--ink);}
.pp-footer__brand p{margin:16px 0 0;font-size:14px;color:var(--muted);max-width:34ch;}
.pp-pay{display:flex;gap:8px;margin-top:20px;flex-wrap:wrap;}
.pp-pay i{
font-style:normal;font-family:"Bungee",sans-serif;font-size:8.5px;letter-spacing:.1em;color:var(--muted);
border:1px solid var(--edge-soft);padding:7px 10px;
}
.pp-compliance{
border-top:1px solid var(--edge);padding:26px 0;display:flex;gap:20px;align-items:flex-start;
}
.pp-21{
flex:none;width:52px;height:52px;border:2px solid var(--prime);border-radius:50%;display:grid;place-items:center;
font-family:"Bungee",sans-serif;font-size:14px;color:var(--prime);
}
.pp-compliance p{margin:0 0 8px;font-size:12.5px;color:var(--muted);line-height:1.6;max-width:92ch;}
.pp-compliance p:last-child{margin-bottom:0;}
.pp-bottom{border-top:1px solid var(--edge);padding:22px 0;display:flex;flex-wrap:wrap;gap:16px;justify-content:space-between;align-items:center;}
.pp-bottom span{font-size:12.5px;color:var(--muted);}
.pp-bottom nav{display:flex;gap:20px;flex-wrap:wrap;}
.pp-bottom nav a{font-size:12.5px;color:var(--muted);}
.pp-bottom nav a:hover{color:var(--prime);}
.pp-ph{border-bottom:1px dotted rgba(255,214,0,.5);}
@media (max-width:1080px){
.pp-deck{grid-template-columns:repeat(2,1fr);}
.pp-cats{grid-template-columns:repeat(2,1fr);}
.pp-trust{grid-template-columns:repeat(2,1fr);}
.pp-trust > div:nth-child(2){border-right:0;}
.pp-trust > div:nth-child(-n+2){border-bottom:1px solid var(--edge);}
.pp-nav{display:none;}
.pp-burger{display:grid;}
.pp-footer__cols{grid-template-columns:repeat(2,1fr);gap:34px;}
}
@media (max-width:860px){
.pp-hero__in{grid-template-columns:1fr;padding:64px 0 72px;gap:40px;}
.pp-hero__art{order:-1;max-width:420px;margin:0 auto;width:100%;}
.pp-news__in{grid-template-columns:1fr;gap:32px;}
.pp-steps{grid-template-columns:1fr;}
.pp-step__line{display:none;}
.pp-review{min-height:0;padding:26px 22px;}
.pp-review p{font-size:15px;}
.pp-review-actions{justify-content:flex-start;}
.pp-section{padding:76px 0;}
.pp-agechip{display:none;}
}
@media (max-width:600px){
.pp-deck{grid-template-columns:1fr;}
.pp-cats{grid-template-columns:1fr;}
.pp-trust{grid-template-columns:1fr;}
.pp-trust > div{border-right:0;border-bottom:1px solid var(--edge);}
.pp-trust > div:last-child{border-bottom:0;}
.pp-footer__cols{grid-template-columns:1fr;}
.pp-wrap{padding:0 18px;}
}
@media (prefers-reduced-motion:reduce){
*,*::before,*::after{animation-duration:.001ms !important;animation-iteration-count:1 !important;transition-duration:.001ms !important;}
}
.pp-logo img{height:34px;width:auto;display:block;}
.pp-footer__brand .pp-logo img{height:44px;}
.pp-catdeck{display:grid;grid-template-columns:repeat(6,1fr);gap:26px 22px;}
.pp-catcard{position:relative;display:block;color:inherit;transition:transform .22s ease,filter .22s ease;}
.pp-catcard:nth-child(1){grid-column:1/span 2;}
.pp-catcard:nth-child(2){grid-column:3/span 2;}
.pp-catcard:nth-child(3){grid-column:5/span 2;}
.pp-catcard:nth-child(4){grid-column:2/span 2;}
.pp-catcard:nth-child(5){grid-column:4/span 2;}
.pp-catcard:hover{transform:translateY(-8px) scale(1.02);filter:drop-shadow(0 16px 30px rgba(0,0,0,.6));}
.pp-card-media{position:relative;width:100%;aspect-ratio:250/168;}
.pp-card-media .pp-shot{
position:absolute;z-index:1;left:7.4%;top:10.7%;width:85.7%;height:51.9%;
display:grid;place-items:center;text-align:center;object-fit:cover;
background:repeating-linear-gradient(135deg,#141C2E 0 9px,#101725 9px 18px);
}
.pp-card-media .pp-shot span{font-family:"Bungee",sans-serif;font-size:9px;letter-spacing:.13em;color:#68789A;line-height:1.8;padding:0 10px;}
.pp-card-media .pp-frame{position:absolute;z-index:3;inset:0;width:100%;height:100%;object-fit:contain;pointer-events:none;user-select:none;}
.pp-card-copy{position:absolute;z-index:4;left:7%;right:7%;top:63.5%;text-align:center;pointer-events:none;}
.pp-card-copy h3{margin:0;font-family:"Chango",sans-serif;font-size:clamp(12px,1.25vw,17px);text-transform:uppercase;line-height:1;color:#fff;text-shadow:0 2px 0 rgba(0,0,0,.75);}
.pp-card-copy p{margin:2px 0 0;font-family:"Bungee",sans-serif;font-size:7.5px;letter-spacing:.12em;color:rgba(255,255,255,.66);}
.pp-hero__char{position:relative;width:100%;max-width:520px;filter:drop-shadow(0 24px 50px rgba(46,155,255,.42));}
.pp-hero__plate{
position:absolute;inset:8% 6%;z-index:0;background-size:cover;background-position:center;
opacity:.4;clip-path:polygon(18% 0,100% 0,100% 82%,82% 100%,0 100%,0 18%);
}
.pp-news__art{position:relative;display:grid;place-items:center;}
.pp-news__art img{width:100%;max-width:215px;filter:drop-shadow(0 18px 34px rgba(20,16,0,.45));}
@media (max-width:1080px){
.pp-catdeck{grid-template-columns:repeat(4,1fr);gap:20px 16px;}
.pp-catcard:nth-child(1){grid-column:1/span 2;}
.pp-catcard:nth-child(2){grid-column:3/span 2;}
.pp-catcard:nth-child(3){grid-column:1/span 2;}
.pp-catcard:nth-child(4){grid-column:3/span 2;}
.pp-catcard:nth-child(5){grid-column:2/span 2;}
}
@media (max-width:600px){
.pp-catdeck{grid-template-columns:1fr;}
.pp-catcard:nth-child(n){grid-column:1;}
}



#pp-gold-hero{
  --pp-gold:#ffd600;
  --pp-blue:#20dfff;
  position:relative;
  isolation:isolate;
  width:100%;
  aspect-ratio:16/9;
  min-height:560px;
  overflow:hidden;
  background-color:#020b18;
  background-image:url("/storage/pocketparty/content/2026/09/hero-desk.png");
  background-repeat:no-repeat;
  background-position:center center;
  background-size:cover;
  border-bottom:1px solid rgba(255,214,0,.45);
  font-family:"Rubik",Arial,sans-serif;
}
#pp-gold-hero *,#pp-gold-hero *::before,#pp-gold-hero *::after{box-sizing:border-box}
#pp-gold-hero .ppg-stage{
  position:relative;
  width:min(100%,1680px);
  height:100%;
  min-height:inherit;
  margin:0 auto;
}
#pp-gold-hero .ppg-copy{
  position:absolute;
  z-index:3;
  top:50%;
  left:clamp(32px,4.5vw,78px);
  width:min(45vw,720px);
  transform:translateY(-49%);
  text-align:left;
}
#pp-gold-hero .ppg-brand{
  margin:0;
  width:min(100%,620px);
}
#pp-gold-hero .ppg-brand img{
  display:block;
  width:100%;
  height:auto;
  object-fit:contain;
  object-position:left center;
  filter:drop-shadow(0 8px 18px rgba(0,68,180,.34));
}
#pp-gold-hero .ppg-kicker{
  margin:clamp(16px,1.5vw,24px) 0 0;
  color:var(--pp-blue);
  font:400 clamp(13px,1.38vw,23px)/1.2 "Bungee","Rubik",sans-serif;
  letter-spacing:.23em;
  text-transform:uppercase;
  text-shadow:0 0 14px rgba(32,223,255,.35);
}
#pp-gold-hero h1{
  margin:clamp(18px,2vw,32px) 0 0;
  font-family:"Bungee","Rubik",sans-serif;
  font-size:clamp(46px,5.15vw,88px);
  font-weight:400;
  font-style:italic;
  line-height:.9;
  letter-spacing:-.045em;
  text-transform:uppercase;
}
#pp-gold-hero h1 span{display:block;white-space:nowrap}
#pp-gold-hero .ppg-title-white{
  color:#fff;
  -webkit-text-stroke:1px rgba(3,7,15,.8);
  text-shadow:0 5px 0 #73808d,0 10px 20px rgba(0,0,0,.55);
}
#pp-gold-hero .ppg-title-gold{
  margin-top:.08em;
  color:#ffe100;
  -webkit-text-stroke:1px #9b6900;
  text-shadow:0 5px 0 #b77a00,0 10px 24px rgba(0,0,0,.58),0 0 22px rgba(255,214,0,.24);
}
#pp-gold-hero .ppg-signup{
  display:block;
  width:min(100%,260px);
  margin:clamp(18px,1.8vw,28px) 0 0;
  filter:drop-shadow(0 12px 20px rgba(0,0,0,.45));
  transition:transform .18s ease,filter .18s ease;
}
#pp-gold-hero .ppg-signup img{display:block;width:100%;height:auto}
#pp-gold-hero .ppg-signup:hover{transform:translateY(-3px);filter:drop-shadow(0 15px 23px rgba(0,0,0,.55))}
#pp-gold-hero .ppg-subtitle{
  margin:clamp(18px,2vw,30px) 0 0;
  color:#fff;
  font-size:clamp(18px,1.55vw,27px);
  font-weight:800;
  line-height:1.2;
  letter-spacing:.01em;
  text-shadow:0 3px 10px rgba(0,0,0,.85);
}
#pp-gold-hero .ppg-sale{
  position:absolute;
  z-index:4;
  top:clamp(22px,3vw,50px);
  left:clamp(510px,40.5vw,690px);
  width:clamp(135px,14vw,225px);
  display:block;
  filter:drop-shadow(0 15px 22px rgba(0,0,0,.52));
  transition:transform .18s ease,filter .18s ease;
}
#pp-gold-hero .ppg-sale img{display:block;width:100%;height:auto}
#pp-gold-hero .ppg-sale:hover{transform:scale(1.045);filter:drop-shadow(0 18px 25px rgba(0,0,0,.6))}
#pp-gold-hero .ppg-actions{
  display:flex;
  flex-wrap:wrap;
  gap:14px;
  margin-top:clamp(24px,2.6vw,40px);
}
#pp-gold-hero .ppg-actions a{
  display:flex;
  align-items:center;
  justify-content:center;
  min-width:174px;
  min-height:56px;
  padding:14px 26px;
  color:#07111c;
  background:linear-gradient(135deg,#fff37c,#ffd000);
  border:2px solid #fff3a5;
  box-shadow:5px 6px 0 #765800,0 8px 24px rgba(0,0,0,.28);
  clip-path:polygon(10px 0,100% 0,100% calc(100% - 10px),calc(100% - 10px) 100%,0 100%,0 10px);
  font:400 12px/1.2 "Bungee","Rubik",Arial,sans-serif;
  letter-spacing:.08em;
  text-transform:uppercase;
  text-decoration:none;
  transition:transform .18s ease,filter .18s ease;
}
#pp-gold-hero .ppg-actions .ppg-labs{
  color:#fff;
  background:linear-gradient(135deg,#158cd3,#24c7ff);
  border-color:#8be7ff;
  box-shadow:5px 6px 0 #07527e,0 8px 24px rgba(0,0,0,.28);
}
#pp-gold-hero .ppg-actions a:hover{transform:translateY(-3px);filter:brightness(1.09)}
#pp-gold-hero .ppg-actions a:focus-visible,#pp-gold-hero .ppg-sale:focus-visible,#pp-gold-hero .ppg-signup:focus-visible{outline:3px solid #fff;outline-offset:4px}

@media(max-width:980px) and (min-width:701px){
  #pp-gold-hero{min-height:520px}
  #pp-gold-hero .ppg-copy{left:28px;width:48vw}
  #pp-gold-hero .ppg-sale{left:42vw}
  #pp-gold-hero .ppg-actions a{min-width:145px;min-height:50px;padding:12px 18px;font-size:10px}
}
@media(max-width:700px){
  #pp-gold-hero{
    aspect-ratio:9/16;
    min-height:760px;
    background-image:url("/storage/pocketparty/content/2026/09/hero-mobile.png");
    background-position:center top;
    background-size:cover;
  }
  #pp-gold-hero .ppg-stage{width:100%;height:100%;min-height:inherit}
  #pp-gold-hero .ppg-copy{
    top:0;
    bottom:0;
    left:18px;
    right:18px;
    width:auto;
    padding-top:clamp(34px,7vw,58px);
    transform:none;
    text-align:center;
  }
  #pp-gold-hero .ppg-brand{width:min(72vw,430px);margin:0 auto}
  #pp-gold-hero .ppg-brand img{object-position:center}
  #pp-gold-hero .ppg-kicker{margin-top:13px;font-size:clamp(11px,3.25vw,16px);letter-spacing:.18em}
  #pp-gold-hero h1{
    width:100%;
    margin-top:14px;
    font-size:clamp(26px,7vw,42px);
    line-height:.92;
    text-align:center;
  }
  #pp-gold-hero h1 span{white-space:normal}
  #pp-gold-hero .ppg-signup{width:min(52vw,220px);margin:18px auto 0}
  #pp-gold-hero .ppg-subtitle{margin-top:16px;font-size:clamp(16px,4.2vw,21px)}
  #pp-gold-hero .ppg-sale{
    top:calc(clamp(34px,7vw,58px) + min(21.024vw,125.56px) + clamp(40px,7.8vw,68px));
    right:12px;
    left:auto;
    width:clamp(88px,24vw,132px);
  }
  #pp-gold-hero .ppg-actions{
    position:absolute;
    top:auto;
    bottom:24px;
    left:0;
    right:0;
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:10px;
    margin:0;
  }
  #pp-gold-hero .ppg-actions a{min-width:0;min-height:50px;padding:12px 8px;font-size:10px;letter-spacing:.045em}
  #pp-gold-hero .ppg-actions .ppg-shop{grid-column:1/-1}
}
@media(max-width:390px){
  #pp-gold-hero{min-height:720px}
  #pp-gold-hero .ppg-copy{left:14px;right:14px}
  #pp-gold-hero .ppg-brand{width:70vw}
  #pp-gold-hero h1{font-size:clamp(26px,7vw,30px)}
}
@media(prefers-reduced-motion:reduce){
  #pp-gold-hero .ppg-sale,#pp-gold-hero .ppg-signup,#pp-gold-hero .ppg-actions a{transition:none}
}



/* Categories background — driven by the settings block at the TOP of this widget. */
section.pp-section.pp-tex.pp-catbg{background:transparent;border-block:1px solid var(--edge);}
section.pp-section.pp-tex.pp-catbg::before{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;background-image:var(--cat-bg-desktop) !important;background-size:cover !important;background-position:center !important;background-repeat:no-repeat !important;filter:brightness(var(--cat-bg-brightness,1)) saturate(var(--cat-bg-saturate,1)) contrast(1.04);opacity:1 !important;-webkit-mask-image:linear-gradient(180deg,transparent 0,#000 var(--cat-bg-fade-top,13%),#000 var(--cat-bg-fade-bottom,85%),transparent 100%) !important;mask-image:linear-gradient(180deg,transparent 0,#000 var(--cat-bg-fade-top,13%),#000 var(--cat-bg-fade-bottom,85%),transparent 100%) !important;}
section.pp-section.pp-tex.pp-catbg::after{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;background-image:radial-gradient(rgba(255,214,0,.18) 1px, transparent 1px);background-size:22px 22px;-webkit-mask-image:radial-gradient(120% 80% at 50% 0%, #000 0%, transparent 72%);mask-image:radial-gradient(120% 80% at 50% 0%, #000 0%, transparent 72%);opacity:.5;}
@media (max-width:700px){section.pp-section.pp-tex.pp-catbg::before{background-image:var(--cat-bg-mobile) !important;}}



.pp-hero h1.pp-display .pp-logoline{display:block;line-height:0;margin:.16em 0 .14em;}
.pp-hero h1.pp-display .pp-heroLogo{display:block;width:min(100%,8.6em) !important;height:auto !important;filter:drop-shadow(0 4px 0 rgba(6,16,36,.92)) drop-shadow(0 12px 30px rgba(46,155,255,.38));}
@media (max-width:700px){.pp-hero h1.pp-display .pp-heroLogo{width:min(100%,7.4em) !important;}.pp-hero h1.pp-display .pp-logoline{margin:.14em 0 .12em;}}



section.pp-section.pp-howbg{position:relative;isolation:isolate;border-block:1px solid var(--edge);}
section.pp-section.pp-howbg::before{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;background-image:url("/storage/pocketparty/content/2026/08/howtoback-desk.png");background-size:cover;background-position:center;background-repeat:no-repeat;filter:brightness(2.45) saturate(1.25) contrast(1.03);-webkit-mask-image:linear-gradient(180deg,transparent 0,#000 11%,#000 87%,transparent 100%);mask-image:linear-gradient(180deg,transparent 0,#000 11%,#000 87%,transparent 100%);}
section.pp-section.pp-howbg::after{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;background-image:radial-gradient(rgba(255,214,0,.15) 1px,transparent 1px);background-size:22px 22px;-webkit-mask-image:radial-gradient(120% 80% at 50% 0%,#000 0%,transparent 70%);mask-image:radial-gradient(120% 80% at 50% 0%,#000 0%,transparent 70%);opacity:.5;}
section.pp-section.pp-howbg > *{position:relative;z-index:1;}
section.pp-section.pp-howbg .pp-step{background:rgba(8,13,26,.82);backdrop-filter:blur(2px);}
@media (max-width:700px){section.pp-section.pp-howbg::before{background-image:url("/storage/pocketparty/content/2026/08/howtoback-mob.png");}}



/* ---- CATEGORY CARD IMAGES ----
   Each of the 5 category cards has one image slot, headed by its own numbered banner.
   Paste a Media Library URL into the slot and the placeholder disappears by itself.
   Export images at 660 x 268 (ratio 2.46 : 1) for a crisp result on retina screens. */
.pp-shot{overflow:hidden;}
.pp-shot__img{display:none;position:absolute !important;inset:0 !important;width:100% !important;height:100% !important;max-width:none !important;max-height:none !important;object-fit:cover !important;object-position:center !important;}
.pp-shot__img[src^="http"],.pp-shot__img[src^="/"],.pp-shot__img[src^="."]{display:block;}
.pp-shot:has(> .pp-shot__img[src^="http"]),.pp-shot:has(> .pp-shot__img[src^="/"]),.pp-shot:has(> .pp-shot__img[src^="."]){background:none;}
.pp-shot:has(> .pp-shot__img[src^="http"]) .pp-shot__ph,.pp-shot:has(> .pp-shot__img[src^="/"]) .pp-shot__ph,.pp-shot:has(> .pp-shot__img[src^="."]) .pp-shot__ph{display:none;}
.pp-shot__ph{display:block;}



/* ---- FEATURED PRODUCT CARDS ----
   4 cards, each headed by its own numbered banner in the markup above.
   Every editable line is flagged in the markup.
   Image slot renders at 249x187 (4:3) — export at 600x450 for retina. */
.pp-prod__img{display:none;position:absolute !important;inset:0 !important;width:100% !important;height:100% !important;max-width:none !important;max-height:none !important;object-fit:contain !important;object-position:center !important;padding:12px;}
.pp-prod__img[src^="http"],.pp-prod__img[src^="/"],.pp-prod__img[src^="."]{display:block;}
.pp-card__art:has(> .pp-prod__img[src^="http"]) .pp-prod__ph,.pp-card__art:has(> .pp-prod__img[src^="/"]) .pp-prod__ph,.pp-card__art:has(> .pp-prod__img[src^="."]) .pp-prod__ph{display:none;}
.pp-prod__ph{display:block;font-family:"Bungee",sans-serif;font-size:9px;letter-spacing:.13em;color:#68789A;line-height:1.8;padding:0 10px;}
.pp-prod__ph b{display:block;color:#8FA3C6;margin-bottom:4px;}
a.pp-plink{color:inherit;text-decoration:none;}
h3.pp-card__name a.pp-plink:hover{color:var(--tier,var(--prime));}
a.pp-add{display:inline-flex;align-items:center;justify-content:center;text-decoration:none;cursor:pointer;}
a.pp-add:hover{transform:translateY(-2px);filter:brightness(1.1);}



/* ---- REVIEWS SECTION : purple theme ---- */
section.pp-revpurple{background:radial-gradient(62% 54% at 78% 18%,rgba(169,107,255,.16),transparent 68%),radial-gradient(50% 46% at 12% 84%,rgba(169,107,255,.10),transparent 70%),linear-gradient(180deg,#08061A,#02040A);}
section.pp-revpurple::before{background-image:radial-gradient(rgba(169,107,255,.20) 1px,transparent 1px) !important;}
section.pp-revpurple .pp-eyebrow{color:var(--violet);}
section.pp-revpurple .pp-btn--ghost{border-color:rgba(169,107,255,.42);}
section.pp-revpurple .pp-btn--ghost:hover{border-color:var(--violet);color:var(--violet);box-shadow:4px 4px 0 rgba(169,107,255,.35);}
section.pp-revpurple .pp-review{background:linear-gradient(160deg,#171033,#0A0718);border-color:rgba(169,107,255,.22);transition:transform .18s ease,border-color .18s ease;}
section.pp-revpurple .pp-review:hover{transform:translateY(-5px);border-color:var(--violet);}
section.pp-revpurple .pp-stars svg{fill:var(--violet);}
section.pp-revpurple .pp-av{background:linear-gradient(140deg,var(--violet),#E4C8FF);color:#1A0733;}
section.pp-revpurple .pp-review footer span{color:#A99BC6;}
section.pp-revpurple .pp-review p{color:#CFC6E6;}



/* ---- SHOP BY CATEGORY : sub-text legibility ---- */
section.pp-catbg .pp-lede{color:#EAF1FF;}
section.pp-catbg .pp-card-copy p{color:#FFFFFF;}



/* ==========================================================================
   HEADLINE FONT  —  original homepage font, italic
   --------------------------------------------------------------------------
   Applies Impact (weight 900, uppercase, italic) to every display headline
   on this page: the hero, all section headlines, category card titles and
   product names.
   NOT changed: the game and card-deck headings (Luckiest Guy) and the
   Bungee sub-labels, which are separate type styles.
   TO REVERT: delete this whole <style> block.
   ========================================================================== */
.pp-display,
.pp-hero h1.pp-display,
.pp-card-copy h3,
.pp-card__name,
.pp-card__name a.pp-plink{
  font-family:Impact,"Arial Black",Arial,sans-serif !important;
  font-weight:900 !important;
  font-style:italic !important;
  letter-spacing:-1px;
  text-transform:uppercase;
}
.pp-hero h1.pp-display span{font-style:italic !important;}
/* Impact is much narrower than Chango, so the hero block would shrink
   (its width is set in ch units). Hold it at a fixed width instead. */
.pp-hero h1.pp-display{max-width:16ch;}



/* READABILITY UPDATE: category labels, featured products and trust badges. */
.pp-catbg .pp-card-copy h3{
  font-size:clamp(13.2px,1.375vw,18.7px);
  letter-spacing:.025em;
  line-height:1.15;
  color:#fff;
}
.pp-catbg .pp-card-copy p{
  font-size:8.25px;
  line-height:1.45;
  margin-top:5px;
}
/* Desktop: anchor labels inside the lower-left area of each card. */
@media (min-width:1081px){
  .pp-catbg .pp-card-copy{
    top:auto;
    bottom:9%;
    left:8%;
    right:8%;
    text-align:left;
  }
}
.pp-head h2.pp-products-title{
  font-size:clamp(33px,4.4vw,50.6px);
  letter-spacing:.035em;
  line-height:1.12;
  text-shadow:none;
  -webkit-text-stroke:0;
}
.pp-deck .pp-card__name,
.pp-deck .pp-card__name a.pp-plink{
  font-size:19px;
  letter-spacing:.035em;
  line-height:1.25;
  text-shadow:none;
  -webkit-text-stroke:0;
  overflow-wrap:anywhere;
}
.pp-deck .pp-card__name{min-width:0;flex:1;}
.pp-deck .pp-card__top{align-items:flex-start;gap:12px;}
.pp-deck .pp-card__hp{flex-shrink:0;}
.pp-trust h3{
  font-size:12px;
  letter-spacing:.13em;
  line-height:1.5;
  white-space:normal;
  margin-bottom:6px;
  color:var(--ink);
  text-shadow:none;
  -webkit-text-stroke:0;
}
.pp-trust p{
  font-size:15px;
  letter-spacing:.02em;
  line-height:1.6;
  color:#B6C2D8;
}

/* Visual-builder overrides and the live Flash Sale block. */
.pocketparty-home { background: var(--void, #03060d); color: var(--ink, #eaf1ff); }
.pocketparty-home .pp-marquee__track { animation-duration: var(--pp-marquee-speed, 34s); }
.pocketparty-home .pp-marquee span { color: var(--pp-marquee-text, #7c8aa8); font-size: var(--pp-marquee-font-size, 11px); }
.pocketparty-home .pp-marquee span b { color: var(--pp-marquee-accent, #ffd600); }
.pocketparty-home .pp-marquee .pp-dot { background: var(--pp-marquee-accent, #ffd600); }
#pp-gold-hero { min-height: var(--pp-hero-min-height, 560px); background-image: var(--pp-hero-desktop); }
section.pp-section.pp-howbg::before { background-image: var(--pp-how-desktop); }
section.pp-revpurple { background-color: var(--pp-reviews-background, #130824); }
.pp-trust { background: var(--pp-trust-background, #0a1120); }
.pp-trust h3 { color: var(--pp-trust-text, #eaf1ff); }
.pp-trust p { color: color-mix(in srgb, var(--pp-trust-text, #eaf1ff) 72%, transparent); }
.pp-step::before { display: none; }
.pp-step__badge {
    display: inline-block;
    margin-bottom: 18px;
    padding: 6px 12px;
    color: #141000;
    background: var(--prime);
    clip-path: polygon(6px 0, 100% 0, 100% calc(100% - 6px), calc(100% - 6px) 100%, 0 100%, 0 6px);
    font: 400 9.5px/1.4 "Bungee", sans-serif;
    letter-spacing: .16em;
    text-transform: uppercase;
}
.pp-stars .is-empty { opacity: .22; }
.pp-news { background: var(--pp-news-background, var(--prime)); color: var(--pp-news-text, #141000); }
.pp-news__signup { position: relative; display: grid; grid-template-columns: 1fr auto; gap: 16px 24px; align-items: center; }
.pp-news__signup .pp-form { min-width: 0; }
.pp-news__signup .pp-form form { width: 100%; }
.pp-news__signup .pp-form .input-group { display: flex; gap: 10px; margin: 0 !important; }
.pp-news__signup .pp-form input { min-width: 0; }
.pp-news__signup .pp-form button { flex: none; padding: 15px 22px; border: 0; background: #0a1020; color: #fff; font: 400 11px/1.2 "Bungee", sans-serif; letter-spacing: .12em; text-transform: uppercase; }
.pp-news__signup > small { grid-column: 1; color: color-mix(in srgb, var(--pp-news-text, #141000) 76%, transparent); line-height: 1.55; }
.pp-news__signup .pp-news__art { grid-column: 2; grid-row: 1 / span 3; }
.pp-news-reward { grid-column: 1; padding: 18px; background: #141000; color: #fff; text-align: center; }
.pp-news-reward[hidden] { display: none; }
.pp-news-reward p { margin: 8px 0; color: #fff; }
.pp-news-code { display: block; color: var(--prime); font: 400 clamp(22px, 4vw, 34px)/1 "Bungee", sans-serif; letter-spacing: .08em; user-select: all; }

.pp-flash-sale { background-color: var(--pp-flash-background, #0a1120); background-image: var(--pp-flash-image, none); background-position: center; background-size: cover; }
.pp-flash-sale .pp-eyebrow { color: var(--pp-flash-accent, #ffd600); }
.pp-flash-sale__status { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; margin-bottom: 34px; padding: 24px; border: 1px solid color-mix(in srgb, var(--pp-flash-accent, #ffd600) 34%, transparent); background: rgba(3, 6, 13, .78); backdrop-filter: blur(8px); }
.pp-flash-sale__status > div > span { display: block; margin-bottom: 10px; color: var(--muted); font: 400 10px/1.3 "Bungee", sans-serif; letter-spacing: .14em; text-transform: uppercase; }
.pp-flash-sale__countdown { display: flex; flex-wrap: wrap; align-items: baseline; gap: 7px 11px; }
.pp-flash-sale__countdown b { color: var(--pp-flash-accent, #ffd600); font: 400 clamp(24px, 4vw, 42px)/1 "Bungee", sans-serif; }
.pp-flash-sale__countdown i { color: var(--muted); font: normal 9px/1 "Bungee", sans-serif; letter-spacing: .08em; text-transform: uppercase; }
.pp-flash-sale__remaining strong { display: block; margin-bottom: 13px; font: 400 20px/1.2 "Bungee", sans-serif; }
.pp-flash-sale__remaining > div, .pp-flash-sale__product-stock { height: 8px; overflow: hidden; background: rgba(255, 255, 255, .1); }
.pp-flash-sale__remaining > div i, .pp-flash-sale__product-stock i { display: block; height: 100%; background: var(--pp-flash-accent, #ffd600); }
.pp-flash-sale__remaining > span, .pp-flash-sale .pp-card > small { display: block; margin-top: 9px; color: var(--muted); font-size: 12px; }
.pp-flash-sale__product-stock { margin-top: 14px; }

@media (max-width: 700px) {
    #pp-gold-hero {
        /* Fallback for older iOS Safari, which drops the max() declaration. */
        min-height: 720px;
        min-height: max(720px, var(--pp-hero-min-height, 560px));
        background-image: var(--pp-hero-mobile);
    }
    section.pp-section.pp-howbg::before { background-image: var(--pp-how-mobile); }
    .pp-news__signup { grid-template-columns: 1fr; }
    .pp-news__signup .pp-news__art { grid-column: 1; grid-row: auto; }
    .pp-news__signup > small, .pp-news-reward { grid-column: 1; }
    .pp-flash-sale__status { grid-template-columns: 1fr; }
}



  #pp-battle-game,
  #pp-battle-game * {
    box-sizing: border-box;
  }

  #pp-battle-game {
    --pp-black: #090b0f;
    --pp-near-black: #121722;
    --pp-blue: #5b3a8f;
    --pp-blue-light: #c3a7ff;
    --pp-gold: #e2b94b;
    --pp-yellow: #ffe66d;
    --pp-red: #ff4f45;
    --pp-orange: #ff8a32;
    --pp-purple: #8a5cff;
    --pp-green: #5ee6a8;
    --pp-white: #fffdf3;
    --pp-muted: #c6cbd2;
    --pp-border: #080b0e;

    /* REPLACE VIA JS CONFIG */
    --pp-hero-font: "Luckiest Guy", "Bungee", "Impact", sans-serif;
    --pp-desktop-screen-image: none;
    --pp-mobile-screen-image: none;
    --pp-mobile-border-image: none;

    width: 100%;
    margin: 0 auto;
    position: relative;
    font-family: "Courier New", "Lucida Console", Monaco, monospace;
  }

  #pp-battle-game button,
  #pp-battle-game input {
    font: inherit;
  }

  #pp-battle-game button {
    -webkit-tap-highlight-color: transparent;
  }

  .pp-game-shell {
    width: 100%;
    padding: 12px;
    background:
      radial-gradient(circle at 15% 15%, rgba(255,230,109,.16), transparent 24%),
      radial-gradient(circle at 85% 20%, rgba(104,200,233,.15), transparent 26%),
      #050608;
  }

  .pp-game-frame {
    width: min(100%, 1600px);
    margin: 0 auto;
    overflow: hidden;
    position: relative;
    border: 6px solid var(--pp-gold);
    outline: 4px solid var(--pp-black);
    background: var(--pp-black);
    box-shadow: 0 0 0 3px #fff0a3, 0 22px 50px rgba(0,0,0,.5);
  }

  .pp-game-frame:focus {
    outline: 4px solid var(--pp-yellow);
  }

  .pp-topbar {
    height: 48px;
    padding: 0 14px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    color: var(--pp-white);
    border-bottom: 4px solid var(--pp-gold);
    background: linear-gradient(90deg, #11151d 0%, #25203c 45%, #11151d 100%);
    position: relative;
    z-index: 50;
  }

  .pp-brand {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    font-weight: 900;
    font-size: clamp(14px, 1.4vw, 20px);
    letter-spacing: 1.5px;
    text-shadow: 2px 2px 0 #000;
  }

  .pp-brand-orb {
    width: 21px;
    height: 21px;
    display: inline-block;
    border: 3px solid #050505;
    border-radius: 50%;
    background: linear-gradient(to bottom, var(--pp-red) 0 43%, #111 43% 57%, #fff 57% 100%);
    box-shadow: inset 0 0 0 2px rgba(255,255,255,.25);
  }

  .pp-top-actions {
    display: flex;
    align-items: center;
    gap: 8px;
  }

  .pp-icon-btn {
    width: 34px;
    height: 30px;
    padding: 0;
    display: grid;
    place-items: center;
    border: 2px solid var(--pp-gold);
    border-radius: 0;
    color: var(--pp-white);
    background: #11151c;
    cursor: pointer;
    transition: transform 150ms ease, background 150ms ease;
  }

  .pp-icon-btn:hover {
    transform: translateY(-1px);
    background: #2e3240;
  }

  .pp-game-view {
    width: 100%;
    aspect-ratio: 2 / 1;
    position: relative;
    overflow: hidden;
    isolation: isolate;
    color: var(--pp-white);
    background-color: #182032;
    background-image: var(--pp-desktop-screen-image);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
  }

  /* hide old decorative bg because you want your own screen background */
  .pp-sky-grid,
  .pp-orbit,
  .pp-star-field {
    display: none !important;
  }

  .pp-screen {
    position: absolute;
    inset: 0;
    display: none;
    overflow: hidden;
  }

  .pp-screen-active {
    display: block;
  }

  #ppIntroScreen,
  #ppEndScreen,
  #ppEmailScreen,
  #ppRewardScreen,
  #ppFinalScreen {
    z-index: 30;
    place-items: center;
    padding: clamp(14px, 2vw, 28px);
    background:
      radial-gradient(circle at 50% 30%, rgba(138, 92, 255, 0.18), transparent 38%),
      linear-gradient(135deg, rgba(10,12,18,.72), rgba(27,24,48,.80));
  }

  #ppIntroScreen.pp-screen-active,
  #ppEndScreen.pp-screen-active,
  #ppEmailScreen.pp-screen-active,
  #ppRewardScreen.pp-screen-active,
  #ppFinalScreen.pp-screen-active {
    display: grid;
  }

  .pp-intro-card,
  .pp-end-card,
  .pp-reward-card {
    width: min(680px, 94%);
    max-height: none;
    overflow: hidden;
    min-height: 0;
    padding: clamp(18px, 2.4vw, 30px);
    position: relative;
    border: 5px solid var(--pp-gold);
    outline: 4px solid #08090d;
    color: var(--pp-white);
    text-align: center;
    background: linear-gradient(180deg, rgba(83,51,132,.95), rgba(30,19,52,.97));
    box-shadow: 12px 12px 0 rgba(0,0,0,.38), inset 0 0 0 3px rgba(255,255,255,.13);
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 8px;
  }

  .pp-intro-logo-wrap {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-bottom: 2px;
  }

  .pp-intro-logo-image {
    width: min(320px, 74%);
    max-width: 100%;
    height: auto;
    display: block;
    object-fit: contain;
  }

  .pp-eyebrow {
    margin: 0;
    color: var(--pp-yellow);
    font-size: clamp(10px, 1vw, 14px);
    font-weight: 900;
    letter-spacing: 2px;
  }

  .pp-intro-card h2,
  .pp-end-card h2,
  .pp-reward-card h2 {
    margin: 0;
    font-family: var(--pp-hero-font);
    font-size: clamp(24px, 3.5vw, 52px);
    line-height: .96;
    letter-spacing: .4px;
    text-shadow: 4px 4px 0 #101010, -2px -2px 0 #101010;
  }

  .pp-intro-card h2 strong {
    color: var(--pp-yellow);
  }

  .pp-intro-copy,
  .pp-reward-intro,
  .pp-end-card > p {
    max-width: 550px;
    margin: 0 auto;
    color: #f1f3f7;
    font-size: clamp(12px, 1.2vw, 17px);
    line-height: 1.35;
  }

  .pp-choice-menu {
    width: min(510px, 100%);
    margin: 6px auto 0;
    padding: 8px;
    border: 4px solid #080a0d;
    background: rgba(8,11,16,.78);
  }

  .pp-choice {
    width: 100%;
    min-height: 44px;
    margin: 0;
    padding: 10px 12px;
    display: flex;
    align-items: center;
    gap: 11px;
    border: 0;
    border-bottom: 2px solid rgba(255,255,255,.08);
    border-radius: 0;
    color: var(--pp-white);
    text-align: left;
    background: transparent;
    cursor: pointer;
  }

  .pp-choice:last-child { border-bottom: 0; }

  .pp-choice:hover,
  .pp-choice.pp-selected {
    color: #0b0c10;
    background: var(--pp-yellow);
  }

  .pp-choice .pp-arrow,
  .pp-attack .pp-arrow {
    flex: 0 0 auto;
    visibility: hidden;
  }

  .pp-choice.pp-selected .pp-arrow,
  .pp-attack.pp-selected .pp-arrow {
    visibility: visible;
    animation: ppArrowPulse 520ms steps(2,end) infinite;
  }

  @keyframes ppArrowPulse {
    50% { transform: translateX(4px); }
  }

  .pp-control-hint {
    margin: 2px 0 0;
    color: #cfd5de;
    font-size: 11px;
    line-height: 1.3;
  }

  #ppBattleScreen { z-index: 10; }
  #ppBattleScreen.pp-screen-active { display: block; }

  .pp-status-card {
    width: 34%;
    min-width: 245px;
    padding: 9px 12px;
    position: absolute;
    z-index: 10;
    color: #17191d;
    border: 4px solid #34413d;
    background: linear-gradient(180deg, #f5f0cf, #d8d4ad);
    box-shadow: 8px 8px 0 rgba(33,43,46,.6), inset 0 0 0 2px rgba(255,255,255,.5);
  }

  .pp-rival-status { left: 3%; top: 4%; }
  .pp-player-status { right: 3%; bottom: 29%; }

  .pp-status-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    font-size: clamp(12px, 1.5vw, 21px);
    font-weight: 900;
  }

  .pp-level { white-space: nowrap; }

  .pp-hp-line {
    margin-top: 7px;
    display: flex;
    align-items: center;
    gap: 8px;
  }

  .pp-hp-label {
    padding: 2px 7px;
    color: #3c3220;
    font-size: 12px;
    font-weight: 900;
    border-radius: 999px;
    background: var(--pp-gold);
  }

  .pp-hp-track {
    flex: 1;
    height: 13px;
    overflow: hidden;
    border: 3px solid #25302d;
    border-radius: 999px;
    background: #282d2d;
  }

  .pp-hp-fill {
    width: 100%;
    height: 100%;
    border-radius: 999px;
    background: linear-gradient(180deg, #8ff2c1, #30bf77);
    transition: width 750ms cubic-bezier(.2,.9,.25,1), background 300ms ease;
  }

  .pp-hp-fill.pp-hp-medium {
    background: linear-gradient(180deg, #ffe46b, #e2ad25);
  }

  .pp-hp-fill.pp-hp-low {
    background: linear-gradient(180deg, #ff786e, #d6332a);
    animation: ppLowHp 600ms infinite alternate;
  }

  @keyframes ppLowHp {
    to { filter: brightness(1.45); }
  }

  .pp-hp-number {
    margin-top: 3px;
    text-align: right;
    font-size: clamp(11px, 1.25vw, 17px);
    font-weight: 900;
  }

  .pp-character-area {
    position: absolute;
    z-index: 5;
  }

  .pp-rival-area { width: 33%; height: 48%; right: 7%; top: 5%; }
  .pp-player-area { width: 38%; height: 51%; left: 5%; bottom: 22%; }

  .pp-platform {
    width: 88%;
    height: 32%;
    position: absolute;
    left: 6%;
    bottom: 5%;
    border-radius: 50%;
    background: radial-gradient(ellipse at center, rgba(90,92,98,.38), rgba(115,115,120,.13) 56%, transparent 72%);
    filter: blur(1px);
  }

  .pp-character {
    width: 74%;
    height: 90%;
    position: absolute;
    z-index: 4;
    object-fit: contain;
    object-position: center bottom;
    filter: drop-shadow(5px 8px 0 rgba(20,20,20,.22)) drop-shadow(0 0 5px rgba(255,255,255,.28));
    image-rendering: auto;
    user-select: none;
    pointer-events: none;
  }

  .pp-rival-character { right: 9%; bottom: 8%; }
  .pp-player-character { left: 6%; bottom: 0; }

  .pp-character.pp-enter-player { animation: ppPlayerEnter 700ms cubic-bezier(.2,.9,.2,1); }
  .pp-character.pp-enter-rival { animation: ppRivalEnter 700ms cubic-bezier(.2,.9,.2,1); }

  @keyframes ppPlayerEnter {
    from { transform: translateX(-120%) scale(.7); opacity: 0; }
    to { transform: translateX(0) scale(1); opacity: 1; }
  }

  @keyframes ppRivalEnter {
    from { transform: translateX(120%) scale(.7); opacity: 0; }
    to { transform: translateX(0) scale(1); opacity: 1; }
  }

  .pp-command-panel {
    height: 25%;
    min-height: 118px;
    position: absolute;
    z-index: 20;
    left: 0;
    right: 0;
    bottom: 0;
    display: grid;
    grid-template-columns: 39% 61%;
    border-top: 6px solid var(--pp-gold);
    background: #10141b;
    box-shadow: inset 0 4px 0 #fff4af, 0 -5px 18px rgba(0,0,0,.22);
  }

  .pp-battle-message {
    padding: clamp(13px, 2vw, 24px);
    display: flex;
    align-items: flex-start;
    color: #f8fbff;
    font-size: clamp(12px, 1.55vw, 20px);
    line-height: 1.35;
    border-right: 5px solid var(--pp-gold);
    background: var(--pp-blue);
    text-shadow: 2px 2px 0 rgba(0,0,0,.55);
  }

  .pp-attack-menu {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 3px;
    padding: 7px;
    background: #e5dec1;
  }

  .pp-attack {
    min-width: 0;
    padding: 7px 9px;
    display: grid;
    grid-template-columns: auto minmax(0,1fr);
    grid-template-rows: auto auto;
    column-gap: 6px;
    align-content: center;
    border: 3px solid #20272a;
    border-radius: 0;
    color: #1b1c20;
    text-align: left;
    background: #f7f1d9;
    cursor: pointer;
    transition: transform 100ms ease, background 100ms ease;
  }

  .pp-attack:hover,
  .pp-attack.pp-selected {
    color: #fff;
    background: #272f43;
  }

  .pp-attack:active { transform: translateY(2px); }

  .pp-attack .pp-arrow {
    grid-row: 1 / 3;
    align-self: center;
  }

  .pp-attack-name {
    overflow: hidden;
    font-size: clamp(10px, 1.05vw, 15px);
    font-weight: 900;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .pp-attack-type {
    margin-top: 2px;
    color: var(--pp-purple);
    font-size: clamp(8px, .8vw, 11px);
    font-weight: 900;
  }

  .pp-attack:hover .pp-attack-type,
  .pp-attack.pp-selected .pp-attack-type {
    color: var(--pp-yellow);
  }

  .pp-attack-menu.pp-disabled {
    pointer-events: none;
    opacity: .58;
    filter: grayscale(.35);
  }

  .pp-round-display {
    padding: 5px 8px;
    position: absolute;
    z-index: 24;
    top: 3%;
    left: 50%;
    transform: translateX(-50%);
    color: #fff;
    border: 3px solid var(--pp-gold);
    background: #161924;
    font-size: clamp(9px, 1vw, 13px);
    font-weight: 900;
    letter-spacing: 1px;
    box-shadow: 3px 3px 0 rgba(0,0,0,.28);
  }

  .pp-effect-layer,
  .pp-screen-flash {
    position: absolute;
    inset: 0;
    z-index: 18;
    pointer-events: none;
    overflow: hidden;
  }

  .pp-screen-flash { z-index: 28; opacity: 0; }
  .pp-screen-flash.pp-flash-white { animation: ppFlashWhite 430ms ease; }
  .pp-screen-flash.pp-flash-red { animation: ppFlashRed 430ms ease; }
  .pp-screen-flash.pp-flash-purple { animation: ppFlashPurple 500ms ease; }

  @keyframes ppFlashWhite {
    0%,100% { opacity: 0; background: #fff; }
    35% { opacity: .72; background: #fff; }
  }

  @keyframes ppFlashRed {
    0%,100% { opacity: 0; background: #ff1f18; }
    40% { opacity: .48; background: #ff1f18; }
  }

  @keyframes ppFlashPurple {
    0%,100% { opacity: 0; background: #8a5cff; }
    40% { opacity: .52; background: #8a5cff; }
  }

  .pp-game-view.pp-shake { animation: ppScreenShake 430ms linear; }

  @keyframes ppScreenShake {
    0%,100% { transform: translate(0,0); }
    15% { transform: translate(-7px,3px); }
    30% { transform: translate(7px,-4px); }
    45% { transform: translate(-6px,-3px); }
    60% { transform: translate(6px,4px); }
    75% { transform: translate(-3px,2px); }
  }

  .pp-hit-target { animation: ppTargetHit 480ms ease; }

  @keyframes ppTargetHit {
    0%,100% { transform: translateX(0); filter: brightness(1); }
    18% { transform: translateX(-13px); filter: brightness(3); }
    38% { transform: translateX(12px); }
    58% { transform: translateX(-8px); }
    78% { transform: translateX(5px); }
  }

  .pp-attacker-lunge-player { animation: ppPlayerLunge 580ms ease; }
  .pp-attacker-lunge-rival { animation: ppRivalLunge 580ms ease; }

  @keyframes ppPlayerLunge {
    0%,100% { transform: translate(0,0) scale(1); }
    45% { transform: translate(27%,-13%) scale(1.08); }
  }

  @keyframes ppRivalLunge {
    0%,100% { transform: translate(0,0) scale(1); }
    45% { transform: translate(-26%,15%) scale(1.08); }
  }

  .pp-orb-effect {
    width: clamp(38px, 5vw, 75px);
    height: clamp(38px, 5vw, 75px);
    position: absolute;
    border: 5px solid #fff;
    border-radius: 50%;
    background: radial-gradient(circle, #fff 0 13%, var(--orb-inner, #ffe66d) 14% 42%, var(--orb-outer, #8a5cff) 43% 70%, transparent 72%);
    box-shadow: 0 0 14px var(--orb-inner, #ffe66d), 0 0 35px var(--orb-outer, #8a5cff);
  }

  .pp-orb-player { left: 25%; top: 45%; animation: ppOrbPlayer 780ms cubic-bezier(.3,.8,.2,1) forwards; }
  .pp-orb-rival { right: 25%; top: 29%; animation: ppOrbRival 780ms cubic-bezier(.3,.8,.2,1) forwards; }

  @keyframes ppOrbPlayer {
    0% { transform: translate(0,0) scale(.2) rotate(0deg); opacity: 0; }
    18% { opacity: 1; }
    100% { transform: translate(690%,-220%) scale(1.6) rotate(540deg); opacity: 0; }
  }

  @keyframes ppOrbRival {
    0% { transform: translate(0,0) scale(.2) rotate(0deg); opacity: 0; }
    18% { opacity: 1; }
    100% { transform: translate(-630%,240%) scale(1.65) rotate(-540deg); opacity: 0; }
  }

  .pp-energy-ring {
    position: absolute;
    border: 5px solid var(--ring-color, #fff);
    border-radius: 50%;
    box-shadow: 0 0 17px var(--ring-color, #fff), inset 0 0 17px var(--ring-color, #fff);
    animation: ppRingExpand 750ms ease-out forwards;
  }

  @keyframes ppRingExpand {
    from { width: 18px; height: 18px; opacity: 1; transform: translate(-50%,-50%) scale(.2); }
    to { width: 280px; height: 280px; opacity: 0; transform: translate(-50%,-50%) scale(1.2); }
  }

  .pp-slash {
    width: 8px;
    height: 150px;
    position: absolute;
    border-radius: 999px;
    background: #fff;
    box-shadow: 0 0 8px #fff, 0 0 22px var(--slash-color, #ff5c42);
    transform: rotate(50deg);
    animation: ppSlash 480ms ease-out forwards;
  }

  @keyframes ppSlash {
    from { opacity: 0; transform: rotate(50deg) scaleY(.1); }
    35% { opacity: 1; transform: rotate(50deg) scaleY(1.1); }
    to { opacity: 0; transform: rotate(50deg) scaleY(1.5); }
  }

  .pp-particle {
    width: var(--particle-size, 8px);
    height: var(--particle-size, 8px);
    position: absolute;
    left: var(--particle-left, 50%);
    top: var(--particle-top, 50%);
    border-radius: var(--particle-radius, 50%);
    background: var(--particle-color, #fff);
    box-shadow: 0 0 10px var(--particle-color, #fff);
    animation: ppParticleBurst 760ms ease-out forwards;
  }

  @keyframes ppParticleBurst {
    from { opacity: 1; transform: translate(-50%,-50%) scale(1); }
    to {
      opacity: 0;
      transform:
        translate(calc(-50% + var(--particle-x, 0px)), calc(-50% + var(--particle-y, 0px)))
        scale(.2)
        rotate(360deg);
    }
  }

  .pp-lightning-bolt {
    width: 10px;
    height: 130px;
    position: absolute;
    background: #fff;
    clip-path: polygon(42% 0, 100% 0, 65% 40%, 100% 40%, 20% 100%, 38% 56%, 0 56%);
    filter: drop-shadow(0 0 5px #fff) drop-shadow(0 0 13px #ffe66d);
    animation: ppLightning 480ms ease-out forwards;
  }

  @keyframes ppLightning {
    0% { opacity: 0; transform: scaleY(.1); }
    20% { opacity: 1; transform: scaleY(1.2); }
    45% { opacity: .25; }
    65% { opacity: 1; }
    100% { opacity: 0; transform: scaleY(1); }
  }

  .pp-flame {
    width: 36px;
    height: 55px;
    position: absolute;
    border-radius: 55% 45% 60% 40%;
    background: radial-gradient(circle at 50% 72%, #fff39c 0 18%, #ff9c32 20% 52%, #ff392e 54% 78%, transparent 80%);
    filter: drop-shadow(0 0 6px #ffb13b) drop-shadow(0 0 15px #ff372a);
    animation: ppFlameRise 820ms ease-out forwards;
  }

  @keyframes ppFlameRise {
    from { opacity: 0; transform: translateY(40px) scale(.3) rotate(-8deg); }
    20% { opacity: 1; }
    to { opacity: 0; transform: translateY(-100px) scale(1.25) rotate(12deg); }
  }

  .pp-end-symbol {
    width: 70px;
    height: 70px;
    margin: 0 auto 6px;
    display: grid;
    place-items: center;
    color: var(--pp-white);
    border: 5px solid var(--pp-red);
    border-radius: 50%;
    background: #11141c;
    font-size: 45px;
    font-weight: 900;
    box-shadow: 0 0 25px rgba(255,79,69,.4);
  }

  .pp-victory-image-wrap {
    width: 100%;
    margin: 0 auto 4px;
    display: none;
    justify-content: center;
    align-items: center;
  }

  .pp-victory-image-wrap.pp-has-image {
    display: flex;
  }

  .pp-victory-image {
    width: min(270px, 62%);
    max-width: 100%;
    max-height: 132px;
    height: auto;
    display: block;
    object-fit: contain;
    object-position: center;
    filter: drop-shadow(5px 7px 0 rgba(0,0,0,.42)) drop-shadow(0 0 13px rgba(255,230,109,.28));
  }

  .pp-email-form { margin-top: 8px; text-align: left; }
  .pp-email-form label {
    display: block;
    margin-bottom: 7px;
    color: var(--pp-yellow);
    font-size: 12px;
    font-weight: 900;
    letter-spacing: 1px;
  }

  .pp-email-row {
    display: grid;
    grid-template-columns: minmax(0,1fr) auto;
  }

  .pp-email-row input {
    width: 100%;
    min-width: 0;
    height: 52px;
    padding: 0 14px;
    border: 4px solid #090b10;
    border-right: 0;
    border-radius: 0;
    color: #111;
    background: #fffef6;
    outline: none;
  }

  .pp-email-row input:focus {
    box-shadow: inset 0 0 0 3px var(--pp-blue-light);
  }

  .pp-email-row button {
    min-width: 130px;
    padding: 0 18px;
    border: 4px solid #090b10;
    border-radius: 0;
    color: #111;
    background: var(--pp-yellow);
    font-weight: 900;
    cursor: pointer;
  }

  .pp-email-row button:hover { background: #fff59c; }
  .pp-email-row button:disabled { cursor: wait; opacity: .7; }

  .pp-form-message {
    min-height: 20px;
    margin: 8px 0 0;
    color: #ff9a92;
    font-size: 12px;
    font-weight: 900;
  }

  .pp-form-message.pp-success { color: var(--pp-green); }

  .pp-privacy-note {
    margin: 8px 0 0;
    color: #cbd2dc;
    font-size: 10px;
    line-height: 1.45;
  }

  .pp-code-label {
    margin: 10px 0 7px;
    color: var(--pp-yellow);
    font-weight: 900;
    letter-spacing: 2px;
  }

  .pp-coupon-code {
    width: min(430px,100%);
    padding: 16px 14px;
    border: 5px dashed var(--pp-gold);
    border-radius: 0;
    color: #111;
    background: repeating-linear-gradient(-45deg, #ffe66d 0 12px, #fff3a7 12px 24px);
    font-size: clamp(28px, 5vw, 58px);
    font-weight: 900;
    letter-spacing: 5px;
    cursor: pointer;
    box-shadow: 7px 7px 0 #08090c, inset 0 0 0 3px rgba(255,255,255,.45);
    animation: ppCodeGlow 900ms infinite alternate;
  }

  @keyframes ppCodeGlow {
    to { filter: brightness(1.12); transform: translateY(-2px); }
  }

  .pp-discount-text { margin: 12px 0 6px; font-size: clamp(17px, 2vw, 25px); }
  .pp-copy-message { min-height: 18px; color: #d6dae1; font-size: 11px; }

  .pp-primary-button {
    margin-top: 10px;
    padding: 13px 21px;
    border: 4px solid #080a0d;
    border-radius: 0;
    color: #111;
    background: var(--pp-yellow);
    font-weight: 900;
    cursor: pointer;
    box-shadow: 5px 5px 0 rgba(0,0,0,.45);
  }

  .pp-primary-button:hover {
    transform: translateY(-2px);
    background: #fff59b;
  }

  .pp-confetti {
    position: absolute;
    inset: 0;
    overflow: hidden;
    pointer-events: none;
  }

  .pp-confetti-piece {
    width: 8px;
    height: 14px;
    position: absolute;
    top: -20px;
    background: var(--confetti-color);
    animation: ppConfettiFall var(--confetti-duration) linear infinite;
    animation-delay: var(--confetti-delay);
  }

  @keyframes ppConfettiFall {
    to { transform: translateY(620px) translateX(var(--confetti-drift)) rotate(720deg); }
  }

  .pp-mobile-controls {
    min-height: 126px;
    padding: 12px clamp(16px, 5vw, 34px);
    display: none;
    align-items: center;
    justify-content: space-between;
    gap: 30px;
    color: #fff;
    border-top: 4px solid var(--pp-gold);
    background: linear-gradient(180deg, #171b24, #090b0f);
  }

  .pp-dpad { width: 112px; height: 112px; position: relative; }

  .pp-control-button {
    width: 38px;
    height: 38px;
    padding: 0;
    display: grid;
    place-items: center;
    position: absolute;
    border: 2px solid #050608;
    border-radius: 0;
    color: #fff;
    background: #343946;
    box-shadow: inset 0 0 0 2px rgba(255,255,255,.07), 3px 3px 0 #050608;
    cursor: pointer;
  }

  .pp-control-button:active {
    transform: translate(2px,2px);
    box-shadow: 1px 1px 0 #050608;
  }

  .pp-up { top: 0; left: 37px; }
  .pp-left { top: 37px; left: 0; }
  .pp-down { top: 74px; left: 37px; }
  .pp-right { top: 37px; left: 74px; }

  .pp-dpad-center {
    width: 38px;
    height: 38px;
    position: absolute;
    top: 37px;
    left: 37px;
    border: 2px solid #050608;
    background: #343946;
  }

  .pp-action-button {
    width: 88px;
    height: 88px;
    display: grid;
    place-items: center;
    align-content: center;
    border: 5px solid #501618;
    border-radius: 50%;
    color: #fff;
    background: radial-gradient(circle at 35% 30%, #ff7f75, #d92d2d 60%, #8c1414);
    box-shadow: 0 7px 0 #501618, 0 11px 18px rgba(0,0,0,.35);
    cursor: pointer;
  }

  .pp-action-button:active {
    transform: translateY(5px);
    box-shadow: 0 2px 0 #501618, 0 5px 10px rgba(0,0,0,.35);
  }

  .pp-action-button span { font-size: 25px; font-weight: 900; }
  .pp-action-button small { font-size: 8px; font-weight: 900; }

  @media (max-width: 780px) {
    .pp-game-shell { padding: 0; background: transparent; }

    .pp-game-frame {
      width: min(100%, 680px);
      aspect-ratio: 680 / 1024;
      border: 0;
      outline: 0;
      background-color: transparent;
      background-image: var(--pp-mobile-border-image);
      background-position: center;
      background-repeat: no-repeat;
      background-size: contain;
      box-shadow: none;
      overflow: hidden;
    }

    /* screen area inside the mobile border image */
    .pp-topbar {
      position: absolute;
      left: 1%;
      right: 1%;
      top: 0.5%;
      height: 9%;
      z-index: 55;
      border-bottom-width: 3px;
    }

    .pp-game-view {
      position: absolute;
      left: 8.8%;
      right: 8.8%;
      top: 14.6%;
      bottom: 31.9%;
      aspect-ratio: auto;
      border: 3px solid var(--pp-gold);
      background-image: var(--pp-mobile-screen-image);
      background-size: cover;
      background-position: center;
      background-repeat: no-repeat;
    }

    .pp-mobile-controls {
      display: flex;
      position: absolute;
      left: 7%;
      right: 7%;
      bottom: 4%;
      min-height: 0;
      padding: 0 4%;
      border-top: 0;
      background: transparent;
      z-index: 60;
    }

    .pp-status-card {
      width: 49%;
      min-width: 0;
      padding: 7px 8px;
      border-width: 3px;
      box-shadow: 4px 4px 0 rgba(33,43,46,.55);
    }

    .pp-rival-status { left: 2%; top: 3%; }
    .pp-player-status { right: 2%; bottom: 31%; }

    .pp-status-heading { font-size: clamp(10px, 3.1vw, 15px); }
    .pp-hp-track { height: 10px; border-width: 2px; }
    .pp-hp-label { padding: 1px 5px; font-size: 9px; }
    .pp-hp-number { font-size: 10px; }
    .pp-round-display { top: 2.5%; font-size: 8px; }

    .pp-rival-area { width: 48%; height: 38%; right: 1%; top: 17%; }
    .pp-player-area { width: 51%; height: 39%; left: 0; bottom: 27%; }
    .pp-character { width: 88%; height: 92%; }

    .pp-command-panel {
      height: 28%;
      min-height: 0;
      grid-template-columns: 37% 63%;
      border-top-width: 4px;
    }

    .pp-battle-message {
      padding: 9px;
      font-size: clamp(9px, 2.65vw, 13px);
      border-right-width: 3px;
    }

    .pp-attack-menu { gap: 2px; padding: 4px; }

    .pp-attack {
      padding: 5px 4px;
      column-gap: 3px;
      border-width: 2px;
    }

    .pp-attack-name { font-size: clamp(7px, 2vw, 10px); }
    .pp-attack-type { font-size: clamp(6px, 1.5vw, 8px); }

    .pp-intro-card,
    .pp-end-card,
    .pp-reward-card {
      width: 96%;
      padding: 16px 12px;
      border-width: 4px;
      outline-width: 2px;
      gap: 6px;
    }

    .pp-intro-logo-image { width: min(260px, 78%); }

    .pp-intro-card h2,
    .pp-end-card h2,
    .pp-reward-card h2 {
      font-size: clamp(22px, 7vw, 36px);
      line-height: .96;
    }

    .pp-intro-copy,
    .pp-reward-intro,
    .pp-end-card > p {
      font-size: 11px;
      line-height: 1.28;
    }

    .pp-choice-menu { margin-top: 8px; }
    .pp-choice { min-height: 38px; padding: 8px 9px; font-size: 11px; }

    .pp-email-row { grid-template-columns: 1fr; gap: 7px; }
    .pp-email-row input { border-right: 4px solid #090b10; }
    .pp-email-row button { height: 46px; }

    .pp-victory-image {
      width: min(210px, 72%);
      max-height: 92px;
    }
  }

  @media (max-width: 430px) {
    .pp-brand { font-size: 12px; }
    .pp-brand-orb { width: 18px; height: 18px; }
    .pp-icon-btn { width: 30px; height: 27px; font-size: 12px; }

    .pp-rival-area { top: 18%; }
    .pp-player-area { bottom: 28%; }
    .pp-command-panel { height: 29%; }

    .pp-mobile-controls {
      bottom: 4.5%;
      padding: 0 5%;
    }

    .pp-dpad { transform: scale(.9); transform-origin: left center; }
    .pp-action-button { width: 78px; height: 78px; }
    .pp-coupon-code { letter-spacing: 2px; }
  }

  @media (min-width: 781px) and (pointer: coarse) {
    .pp-mobile-controls { display: flex; }
  }

  @media (prefers-reduced-motion: reduce) {
    #pp-battle-game *,
    #pp-battle-game *::before,
    #pp-battle-game *::after {
      animation-duration: .01ms !important;
      animation-iteration-count: 1 !important;
      scroll-behavior: auto !important;
    }
  }



  /* Prevent Elementor/widget overflow from creating internal scrollbars */
  #pp-battle-game,
  #pp-battle-game .pp-game-frame,
  #pp-battle-game .pp-game-view,
  #pp-battle-game .pp-screen,
  #pp-battle-game .pp-intro-card,
  #pp-battle-game .pp-end-card,
  #pp-battle-game .pp-reward-card {
    overflow: hidden !important;
  }

  /* Make the supplied logo reliable and clearly visible */
  #pp-battle-game .pp-intro-logo-wrap {
    min-height: 74px;
    margin: 0 0 4px;
  }

  #pp-battle-game .pp-intro-logo-image {
    display: block !important;
    width: min(310px, 72%) !important;
    max-height: 86px;
    height: auto !important;
    object-fit: contain;
    object-position: center;
  }

  /* Cleaner desktop composition with no internal scrolling */
  @media (min-width: 781px) {
    #pp-battle-game .pp-game-shell {
      padding: 10px;
    }

    #pp-battle-game .pp-game-frame {
      width: min(100%, 1500px);
    }

    #pp-battle-game .pp-game-view {
      aspect-ratio: 2 / 1;
      min-height: 0;
      background-position: center;
      background-size: cover;
    }

    #pp-battle-game #ppIntroScreen,
    #pp-battle-game #ppEndScreen,
    #pp-battle-game #ppEmailScreen,
    #pp-battle-game #ppRewardScreen,
    #pp-battle-game #ppFinalScreen {
      padding: clamp(12px, 1.5vw, 24px);
      background: linear-gradient(90deg, rgba(6,9,19,.18), rgba(6,9,19,.08));
    }

    #pp-battle-game .pp-intro-card,
    #pp-battle-game .pp-end-card,
    #pp-battle-game .pp-reward-card {
      width: min(760px, 61%);
      max-height: calc(100% - 24px);
      padding: clamp(14px, 1.8vw, 24px);
      gap: 7px;
      background: linear-gradient(180deg, rgba(79,47,126,.94), rgba(28,18,50,.97));
    }

    #pp-battle-game .pp-intro-card h2,
    #pp-battle-game .pp-end-card h2,
    #pp-battle-game .pp-reward-card h2 {
      font-family: var(--pp-hero-font) !important;
      font-size: clamp(34px, 3.5vw, 58px);
      line-height: .88;
      letter-spacing: -1px;
    }

    #pp-battle-game .pp-intro-copy {
      margin: 2px auto 4px;
    }

    #pp-battle-game .pp-choice-menu {
      margin-top: 5px;
    }
  }

  /* Custom handheld image becomes the entire mobile game body */
  @media (max-width: 780px) {
    #pp-battle-game {
      width: 100%;
      max-width: 520px;
      margin-inline: auto;
    }

    #pp-battle-game .pp-game-shell {
      padding: 0;
      background: transparent;
    }

    #pp-battle-game .pp-game-frame {
      width: 100%;
      aspect-ratio: 1368 / 2048;
      position: relative;
      border: 0 !important;
      outline: 0 !important;
      box-shadow: none !important;
      background-color: transparent;
      background-image: var(--pp-mobile-border-image);
      background-repeat: no-repeat;
      background-position: center top;
      background-size: 100% 100%;
    }

    /* The handheld art already includes its own controls and casing */
    #pp-battle-game .pp-topbar {
      display: none !important;
    }

    /* Exact black-screen opening from the supplied 1368x2048 frame */
    #pp-battle-game .pp-game-view {
      position: absolute;
      left: 14.75%;
      right: 14.75%;
      top: 6.85%;
      bottom: 43.90%;
      width: auto;
      height: auto;
      aspect-ratio: auto;
      border: 0 !important;
      outline: 0 !important;
      box-shadow: none !important;
      background-image: var(--pp-mobile-screen-image);
      background-position: center;
      background-repeat: no-repeat;
      background-size: cover;
    }

    #pp-battle-game #ppIntroScreen,
    #pp-battle-game #ppEndScreen,
    #pp-battle-game #ppEmailScreen,
    #pp-battle-game #ppRewardScreen,
    #pp-battle-game #ppFinalScreen {
      padding: 2.5%;
      background: rgba(7,13,26,.15);
    }

    #pp-battle-game .pp-intro-card,
    #pp-battle-game .pp-end-card,
    #pp-battle-game .pp-reward-card {
      width: 100%;
      height: 100%;
      max-height: 100%;
      padding: 4.5% 4%;
      border: 2px solid var(--pp-gold);
      outline: 2px solid #08090d;
      box-shadow: none;
      gap: 1.4%;
      justify-content: center;
      background: linear-gradient(180deg, rgba(79,47,126,.93), rgba(28,18,50,.97));
    }

    #pp-battle-game .pp-intro-logo-wrap {
      min-height: 0;
      height: 13%;
      margin: 0;
    }

    #pp-battle-game .pp-intro-logo-image {
      width: min(235px, 68%) !important;
      max-height: 100%;
    }

    #pp-battle-game .pp-eyebrow {
      font-size: clamp(7px, 1.9vw, 10px);
      letter-spacing: 1px;
    }

    #pp-battle-game .pp-intro-card h2,
    #pp-battle-game .pp-end-card h2,
    #pp-battle-game .pp-reward-card h2 {
      font-family: var(--pp-hero-font) !important;
      font-size: clamp(19px, 6.2vw, 31px);
      line-height: .88;
      letter-spacing: -.5px;
    }

    #pp-battle-game .pp-intro-copy,
    #pp-battle-game .pp-reward-intro,
    #pp-battle-game .pp-end-card > p {
      font-size: clamp(7px, 2.15vw, 10px);
      line-height: 1.2;
      margin: 1% auto;
    }

    #pp-battle-game .pp-choice-menu {
      width: 96%;
      margin: 1.5% auto 0;
      padding: 2%;
      border-width: 2px;
    }

    #pp-battle-game .pp-choice {
      min-height: 0;
      height: 39px;
      padding: 5px 7px;
      font-size: clamp(8px, 2.35vw, 11px);
    }

    #pp-battle-game .pp-control-hint {
      margin-top: 1%;
      font-size: clamp(6px, 1.75vw, 8px);
      white-space: nowrap;
    }

    /* Invisible click/tap layer aligned to the buttons printed in the image */
    #pp-battle-game .pp-mobile-controls {
      display: block !important;
      position: absolute;
      inset: 0;
      min-height: 0;
      padding: 0;
      border: 0;
      background: transparent;
      pointer-events: none;
      z-index: 80;
    }

    #pp-battle-game .pp-dpad {
      position: absolute;
      inset: 0;
      width: 100%;
      height: 100%;
      transform: none !important;
    }

    #pp-battle-game .pp-control-button,
    #pp-battle-game .pp-action-button {
      position: absolute;
      display: block;
      padding: 0;
      margin: 0;
      border: 0 !important;
      outline: 0 !important;
      box-shadow: none !important;
      background: transparent !important;
      color: transparent !important;
      opacity: 0.001;
      pointer-events: auto;
      cursor: pointer;
      -webkit-tap-highlight-color: transparent;
    }

    #pp-battle-game .pp-control-button:active,
    #pp-battle-game .pp-action-button:active {
      transform: none !important;
      box-shadow: none !important;
    }

    #pp-battle-game .pp-up {
      left: 17.0%; top: 65.8%; width: 9.0%; height: 6.4%;
    }

    #pp-battle-game .pp-left {
      left: 9.5%; top: 70.5%; width: 9.0%; height: 6.4%;
    }

    #pp-battle-game .pp-down {
      left: 17.0%; top: 75.2%; width: 9.0%; height: 6.4%;
    }

    #pp-battle-game .pp-right {
      left: 24.5%; top: 70.5%; width: 9.0%; height: 6.4%;
    }

    #pp-battle-game .pp-dpad-center {
      display: none !important;
    }

    #pp-battle-game .pp-action-button {
      left: 74.8%;
      top: 68.0%;
      width: 13.5%;
      height: 9.2%;
      border-radius: 50%;
    }

    #pp-battle-game .pp-action-button span,
    #pp-battle-game .pp-action-button small {
      display: none !important;
    }

    /* Mobile battle UI scaling */
    #pp-battle-game .pp-status-card {
      border-width: 2px;
      padding: 4px 5px;
    }

    #pp-battle-game .pp-command-panel {
      border-top-width: 2px;
    }
  }

  /* Elementor editor can emulate a coarse pointer on desktop; never reveal mobile controls there */
  @media (min-width: 781px) {
    #pp-battle-game .pp-mobile-controls {
      display: none !important;
    }
  }



  @media (max-width: 780px) {
    /* Keep the card content top-aligned instead of vertically centering an
       over-height form, which was pushing the victory image above the screen. */
    #pp-battle-game #ppEmailScreen .pp-reward-card {
      position: relative;
      justify-content: flex-start !important;
      padding: 64px 4% 4.5% !important;
    }

    /* Pin the image to a safe position inside the card. Its position no longer
       depends on the height of the email form below it. */
    #pp-battle-game #ppEmailScreen .pp-victory-image-wrap {
      position: absolute !important;
      top: 12px !important;
      left: 0 !important;
      right: 0 !important;
      width: 100% !important;
      height: 44px !important;
      max-height: 44px !important;
      margin: 0 auto !important;
      display: none;
      justify-content: center;
      align-items: center;
      overflow: visible !important;
      z-index: 3;
    }

    #pp-battle-game #ppEmailScreen .pp-victory-image-wrap.pp-has-image {
      display: flex;
    }

    #pp-battle-game #ppEmailScreen .pp-victory-image {
      width: min(176px, 58%) !important;
      max-width: 58% !important;
      max-height: 42px !important;
      height: auto !important;
      display: block;
      object-fit: contain;
      object-position: center;
      transform: none !important;
    }
  }

  @media (max-width: 430px) {
    #pp-battle-game #ppEmailScreen .pp-reward-card {
      padding-top: 57px !important;
    }

    #pp-battle-game #ppEmailScreen .pp-victory-image-wrap {
      top: 10px !important;
      height: 38px !important;
      max-height: 38px !important;
    }

    #pp-battle-game #ppEmailScreen .pp-victory-image {
      width: min(154px, 55%) !important;
      max-width: 55% !important;
      max-height: 36px !important;
    }
  }



  @media (min-width: 781px) {

    /* Give the victory/email card enough real vertical room. */
    #pp-battle-game #ppEmailScreen .pp-reward-card {
      width: min(760px, 72%) !important;
      min-height: 360px !important;
      max-height: calc(100% - 36px) !important;
      padding: 24px 34px 22px !important;

      display: flex !important;
      flex-direction: column !important;
      justify-content: center !important;
      align-items: stretch !important;
      gap: 10px !important;

      overflow: visible !important;
    }

    /* Keep the YOU WON graphic in normal document flow on desktop. */
    #pp-battle-game #ppEmailScreen .pp-victory-image-wrap {
      position: static !important;
      width: 100% !important;
      height: auto !important;
      max-height: none !important;
      margin: 0 auto 2px !important;

      flex: 0 0 auto !important;
      justify-content: center !important;
      align-items: center !important;

      overflow: visible !important;
    }

    #pp-battle-game #ppEmailScreen .pp-victory-image-wrap.pp-has-image {
      display: flex !important;
    }

    #pp-battle-game #ppEmailScreen .pp-victory-image {
      position: static !important;
      display: block !important;

      width: min(300px, 52%) !important;
      max-width: 300px !important;
      max-height: 92px !important;
      height: auto !important;

      margin: 0 auto !important;
      object-fit: contain !important;
      object-position: center !important;
      transform: none !important;

      flex: 0 0 auto !important;
    }

    #pp-battle-game #ppEmailScreen .pp-eyebrow {
      position: static !important;
      display: block !important;
      margin: 2px 0 0 !important;

      color: var(--pp-yellow) !important;
      text-align: center !important;
      line-height: 1.2 !important;
    }

    /* This fallback is hidden by JS when the YOU WON image loads. */
    #pp-battle-game #ppEmailScreen #ppVictoryFallback {
      position: static !important;
      margin: 0 !important;
      text-align: center !important;
    }

    #pp-battle-game #ppEmailScreen .pp-reward-intro {
      position: static !important;
      width: 100% !important;
      max-width: 600px !important;
      margin: 0 auto 4px !important;

      text-align: center !important;
      font-size: clamp(13px, 1.15vw, 17px) !important;
      line-height: 1.35 !important;
    }

    /*
      Elementor/theme form rules can otherwise interfere with this row.
      Force the email form back into a normal, predictable desktop layout.
    */
    #pp-battle-game #ppEmailScreen .pp-email-form {
      position: relative !important;
      inset: auto !important;

      width: 100% !important;
      max-width: 610px !important;
      height: auto !important;
      min-height: 0 !important;

      margin: 6px auto 0 !important;
      padding: 0 !important;

      display: block !important;
      align-self: center !important;
      overflow: visible !important;

      text-align: left !important;
      transform: none !important;
    }

    #pp-battle-game #ppEmailScreen .pp-email-form label {
      position: static !important;
      inset: auto !important;

      display: block !important;
      width: 100% !important;
      height: auto !important;

      margin: 0 0 7px !important;
      padding: 0 !important;

      color: var(--pp-yellow) !important;
      background: transparent !important;

      font-size: 12px !important;
      font-weight: 900 !important;
      line-height: 1.2 !important;
      letter-spacing: 1px !important;

      transform: none !important;
      opacity: 1 !important;
    }

    #pp-battle-game #ppEmailScreen .pp-email-row {
      position: relative !important;
      inset: auto !important;

      width: 100% !important;
      height: 54px !important;
      min-height: 54px !important;

      margin: 0 !important;
      padding: 0 !important;

      display: grid !important;
      grid-template-columns: minmax(0, 1fr) 150px !important;
      gap: 0 !important;
      align-items: stretch !important;

      overflow: visible !important;
      transform: none !important;
    }

    #pp-battle-game #ppEmailScreen #ppEmailInput {
      position: static !important;
      inset: auto !important;

      grid-column: 1 !important;

      width: 100% !important;
      min-width: 0 !important;
      max-width: none !important;
      height: 54px !important;
      min-height: 54px !important;

      margin: 0 !important;
      padding: 0 15px !important;

      border: 4px solid #090b10 !important;
      border-right: 0 !important;
      border-radius: 0 !important;

      background: #fffef6 !important;
      color: #111111 !important;
      -webkit-text-fill-color: #111111 !important;

      font-size: 15px !important;
      line-height: 46px !important;

      box-shadow: none !important;
      opacity: 1 !important;
      transform: none !important;
      appearance: none !important;
      -webkit-appearance: none !important;
      box-sizing: border-box !important;
    }

    #pp-battle-game #ppEmailScreen #ppEmailInput::placeholder {
      color: #777777 !important;
      -webkit-text-fill-color: #777777 !important;
      opacity: 1 !important;
    }

    #pp-battle-game #ppEmailScreen #ppEmailInput:focus {
      outline: none !important;
      box-shadow: inset 0 0 0 3px var(--pp-blue-light) !important;
    }

    #pp-battle-game #ppEmailScreen #ppEmailSubmit {
      position: static !important;
      inset: auto !important;

      grid-column: 2 !important;

      width: 150px !important;
      min-width: 150px !important;
      max-width: 150px !important;
      height: 54px !important;
      min-height: 54px !important;

      margin: 0 !important;
      padding: 0 16px !important;

      border: 4px solid #090b10 !important;
      border-radius: 0 !important;

      background: var(--pp-yellow) !important;
      color: #111111 !important;
      -webkit-text-fill-color: #111111 !important;

      font-size: 14px !important;
      font-weight: 900 !important;
      line-height: 46px !important;
      text-align: center !important;

      box-shadow: none !important;
      opacity: 1 !important;
      transform: none !important;
      box-sizing: border-box !important;
      cursor: pointer !important;
    }

    #pp-battle-game #ppEmailScreen #ppEmailSubmit:hover {
      background: #fff59c !important;
    }

    #pp-battle-game #ppEmailScreen .pp-form-message {
      position: static !important;
      width: 100% !important;
      min-height: 18px !important;

      margin: 7px 0 0 !important;
      padding: 0 !important;

      font-size: 11px !important;
      line-height: 1.3 !important;
      transform: none !important;
    }

    #pp-battle-game #ppEmailScreen .pp-privacy-note {
      position: static !important;
      width: 100% !important;

      margin: 3px 0 0 !important;
      padding: 0 !important;

      color: #cbd2dc !important;
      font-size: 10px !important;
      line-height: 1.3 !important;
      text-align: left !important;

      transform: none !important;
    }
  }

  /* Slightly tighter desktop/tablet sizing if the available game area is short. */
  @media (min-width: 781px) and (max-width: 1000px) {
    #pp-battle-game #ppEmailScreen .pp-reward-card {
      min-height: 320px !important;
      padding: 18px 26px !important;
      gap: 7px !important;
    }

    #pp-battle-game #ppEmailScreen .pp-victory-image {
      width: min(250px, 48%) !important;
      max-height: 76px !important;
    }

    #pp-battle-game #ppEmailScreen .pp-email-row,
    #pp-battle-game #ppEmailScreen #ppEmailInput,
    #pp-battle-game #ppEmailScreen #ppEmailSubmit {
      height: 50px !important;
      min-height: 50px !important;
    }
  }



.pp-ntimer{margin:26px 0 0;}
.pp-ntimer__lbl{margin:0 0 10px !important;font-family:"Bungee",sans-serif;font-size:9.5px;letter-spacing:.18em;text-transform:uppercase;color:#453800 !important;}
.pp-ntimer__row{display:flex;gap:9px;}
.pp-ntimer__row > div{min-width:70px;padding:11px 10px;text-align:center;background:#141000;border:1px solid rgba(20,16,0,.5);clip-path:polygon(8px 0,100% 0,100% calc(100% - 8px),calc(100% - 8px) 100%,0 100%,0 8px);}
.pp-ntimer__row b{display:block;font-family:"Bungee",sans-serif;font-size:22px;line-height:1;color:var(--prime);font-variant-numeric:tabular-nums;}
.pp-ntimer__row span{display:block;font-family:"Bungee",sans-serif;font-size:8px;letter-spacing:.14em;color:#9A8300;margin-top:6px;}
#pp-newsletter .pp-news-status{margin:12px 0 0;font-size:14px;line-height:1.4;}
#pp-newsletter .pp-news-status:empty{display:none;}
#pp-newsletter .pp-news-reward[hidden]{display:none !important;}
#pp-newsletter .pp-news-reward{margin-top:18px;padding:20px;background:#141000;color:#fff;border:2px solid currentColor;text-align:center;}
#pp-newsletter .pp-news-reward strong,#pp-newsletter .pp-news-reward p{color:#fff !important;}
#pp-newsletter .pp-news-reward p{margin:10px 0;font-size:14px;}
#pp-newsletter .pp-news-code{display:block;color:var(--prime,#ffe21f);font-family:"Bungee",sans-serif;font-size:clamp(24px,5vw,34px);letter-spacing:.08em;user-select:all;}
#pp-newsletter button:disabled{opacity:.65;cursor:wait;}
@media (max-width:600px){.pp-ntimer__row > div{flex:1;min-width:0;}}

/* Category 2: fantasy category showcase */
.ppc2{
  --ppc2-gold:#ffd447;
  --ppc2-cyan:#27d3ff;
  --ppc2-ink:#f4f7ff;
  --ppc2-muted:#b9c4df;
  position:relative;
  isolation:isolate;
  overflow:hidden;
  padding:clamp(42px,4.5vw,72px) clamp(16px,3vw,48px) clamp(36px,4vw,60px);
  color:var(--ppc2-ink);
  background:#030b21 var(--ppc2-bg-desktop) center/cover no-repeat;
  font-family:"Rajdhani","Rubik",sans-serif;
}
.ppc2::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  background:linear-gradient(180deg,rgba(2,8,27,.18),rgba(2,8,27,.04) 42%,rgba(2,7,22,.58));
  pointer-events:none;
}
.ppc2::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  z-index:-1;
  height:30%;
  background:linear-gradient(180deg,transparent,rgba(1,5,18,.78));
  pointer-events:none;
}
.ppc2__inner{position:relative;width:100%;max-width:1600px;margin:0 auto;}
.ppc2__top{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.16fr);height:clamp(410px,34vw,550px);min-height:0;align-items:start;}
.ppc2__header{position:relative;z-index:2;padding-top:clamp(0px,1vw,18px);}
.ppc2__eyebrow{margin:0 0 clamp(40px,4.4vw,68px);color:var(--ppc2-cyan);font-family:"Bungee","Rubik",sans-serif;font-size:clamp(10px,.86vw,14px);font-weight:400;letter-spacing:.28em;text-transform:uppercase;text-shadow:0 0 12px rgba(39,211,255,.65);}
.ppc2__title-wrap{position:relative;display:inline-block;max-width:100%;}
.ppc2__crown{position:absolute;left:54%;top:-.77em;width:clamp(48px,5vw,88px);transform:translateX(-50%);filter:drop-shadow(0 0 11px rgba(255,212,71,.75));}
.ppc2__title{margin:0;font-family:"Russo One",Impact,"Arial Black",sans-serif;font-size:clamp(39px,5.15vw,88px);font-style:italic;font-weight:400;line-height:.98;letter-spacing:-.025em;text-transform:uppercase;filter:drop-shadow(0 4px 0 #071744) drop-shadow(0 0 22px rgba(41,122,255,.65));}
.ppc2__title span,.ppc2__title strong{-webkit-background-clip:text;background-clip:text;color:transparent;}
.ppc2__title span{background-image:linear-gradient(180deg,#fff 0%,#e4eaf6 46%,#8d9ab5 57%,#f3f6fc 100%);}
.ppc2__title strong{background-image:linear-gradient(180deg,#fff4b2 0%,#ffd447 38%,#efa800 60%,#ffe47a 100%);font-weight:400;}
.ppc2__subheading{margin:clamp(16px,1.7vw,26px) 0 0 clamp(8px,3vw,52px);color:#e8edfa;font-family:"Bungee","Rubik",sans-serif;font-size:clamp(10px,1vw,16px);letter-spacing:.25em;line-height:1.5;text-transform:uppercase;}
.ppc2__hero{position:relative;z-index:1;width:116%;margin:clamp(-78px,-4vw,-30px) -8% 0 -8%;mix-blend-mode:screen;pointer-events:none;}
.ppc2__hero img{display:block;width:100%;height:auto;-webkit-mask-image:linear-gradient(180deg,#000 0%,#000 82%,transparent 100%);mask-image:linear-gradient(180deg,#000 0%,#000 82%,transparent 100%);}
.ppc2__sign{position:absolute;left:54.5%;top:48%;width:36%;margin:0;transform:rotate(-7deg) skewX(-5deg);color:var(--ppc2-gold);font-family:"Russo One",Impact,sans-serif;font-size:clamp(15px,1.72vw,30px);line-height:1.13;text-align:center;text-transform:uppercase;text-shadow:0 0 8px rgba(255,212,71,.5);}
.ppc2__grid{position:relative;z-index:3;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:clamp(11px,1.15vw,19px);margin-top:clamp(-90px,-5.3vw,-42px);}
.ppc2-card{min-width:0;padding:2px;border-radius:14px;background:linear-gradient(145deg,#fff5bd,var(--ppc2-gold) 25%,#7d5000 52%,var(--ppc2-gold) 78%,#fff3b0);box-shadow:0 0 16px rgba(255,212,71,.28),0 0 42px rgba(28,105,255,.22);transition:transform .28s ease,box-shadow .28s ease;}
.ppc2-card:hover{transform:translateY(-7px);box-shadow:0 0 24px rgba(255,212,71,.52),0 0 56px rgba(28,105,255,.38);}
.ppc2-card__body{display:flex;height:100%;min-height:clamp(300px,23.5vw,390px);flex-direction:column;overflow:hidden;border-radius:12px;background:linear-gradient(180deg,#0b225c 0%,#06143a 57%,#03091f 100%);}
.ppc2-card__media{position:relative;display:block;aspect-ratio:1/.98;overflow:hidden;background:radial-gradient(circle at 50% 45%,rgba(74,143,255,.6),transparent 62%),linear-gradient(180deg,#11337e,#07163d);clip-path:polygon(0 0,100% 0,100% 90%,63% 90%,57% 100%,43% 100%,37% 90%,0 90%);}
.ppc2-card__media img{width:100%;height:100%;object-fit:cover;transition:transform .45s ease;}
.ppc2-card:hover .ppc2-card__media img{transform:scale(1.055);}
.ppc2-card__content{display:flex;flex:1;flex-direction:column;align-items:center;padding:clamp(10px,1vw,16px) clamp(8px,1vw,15px) clamp(12px,1.25vw,20px);text-align:center;}
.ppc2-card__content h3{margin:0;color:#fff;font-family:"Bungee","Rubik",sans-serif;font-size:clamp(12px,1vw,17px);font-style:normal;font-weight:400;letter-spacing:.025em;line-height:1.3;text-transform:uppercase;}
.ppc2-card__content p{margin:5px 0 12px;color:var(--ppc2-muted);font-size:clamp(10px,.78vw,13px);font-weight:600;letter-spacing:.055em;line-height:1.25;text-transform:uppercase;}
.ppc2-card__button{display:inline-flex;width:100%;min-height:42px;margin-top:auto;align-items:center;justify-content:center;gap:.55em;padding:.7em .65em;border-radius:7px;color:#11162a;background:linear-gradient(180deg,#ffe773,#ffd026 50%,#efa800);box-shadow:0 0 14px rgba(255,200,26,.48),inset 0 1px 0 rgba(255,255,255,.68);font-family:"Bungee","Rubik",sans-serif;font-size:clamp(9px,.76vw,12px);letter-spacing:.05em;line-height:1.2;text-transform:uppercase;transition:filter .2s ease,box-shadow .2s ease;}
.ppc2-card__button:hover{filter:brightness(1.08);box-shadow:0 0 22px rgba(255,200,26,.72),inset 0 1px 0 rgba(255,255,255,.72);}
.ppc2-card__button svg{width:1em;height:1em;flex:none;}
.ppc2__features{position:relative;z-index:2;display:grid;grid-template-columns:repeat(4,1fr);max-width:1320px;margin:clamp(34px,4.2vw,64px) auto 0;}
.ppc2-feature{display:flex;min-width:0;align-items:center;justify-content:center;gap:13px;padding:5px 18px;}
.ppc2-feature+.ppc2-feature{border-left:1px solid rgba(39,211,255,.32);}
.ppc2-feature>svg,.ppc2-feature>img{width:clamp(34px,2.7vw,46px);height:clamp(34px,2.7vw,46px);flex:none;color:var(--ppc2-cyan);object-fit:contain;filter:drop-shadow(0 0 8px rgba(39,211,255,.7));}
.ppc2-feature h3,.ppc2-feature p{margin:0;text-transform:uppercase;}
.ppc2-feature h3{color:var(--ppc2-cyan);font-family:"Bungee","Rubik",sans-serif;font-size:clamp(9px,.8vw,13px);font-weight:400;letter-spacing:.12em;line-height:1.4;}
.ppc2-feature p{margin-top:2px;color:#e4eafb;font-size:clamp(9px,.7vw,12px);font-weight:600;letter-spacing:.09em;line-height:1.35;}
@media (max-width:1100px){
  .ppc2__top{grid-template-columns:1fr;height:auto;min-height:0;}
  .ppc2__header{text-align:center;}
  .ppc2__hero{width:min(86%,720px);margin:8px auto -40px;}
  .ppc2__grid{grid-template-columns:repeat(3,minmax(0,1fr));margin-top:12px;}
  .ppc2-card__body{min-height:390px;}
  .ppc2__features{grid-template-columns:repeat(2,1fr);gap:22px 0;}
  .ppc2-feature{justify-content:flex-start;}
  .ppc2-feature:nth-child(3){border-left:0;}
}
@media (max-width:700px){
  .ppc2{padding:32px 16px 38px;background-image:var(--ppc2-bg-mobile);background-position:center top;}
  .ppc2__eyebrow{margin-bottom:38px;font-size:9px;letter-spacing:.18em;}
  .ppc2__crown{left:50%;width:50px;}
  .ppc2__title{font-size:clamp(31px,10.2vw,48px);line-height:1.08;}
  .ppc2__title span,.ppc2__title strong{display:inline;}
  .ppc2__subheading{max-width:330px;margin:13px auto 0;font-size:9px;letter-spacing:.15em;line-height:1.6;}
  .ppc2__hero{width:104%;max-width:500px;margin:10px -2% -30px;}
  .ppc2__sign{font-size:clamp(11px,3.6vw,18px);}
  .ppc2__grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:4px;}
  .ppc2-card:hover{transform:none;}
  .ppc2-card__body{min-height:clamp(260px,72vw,315px);}
  .ppc2-card__content{padding:9px 9px 12px;}
  .ppc2-card__content h3{font-size:clamp(10px,3vw,13px);}
  .ppc2-card__content p{font-size:clamp(8px,2.45vw,10px);}
  .ppc2-card__button{min-height:38px;font-size:clamp(8px,2.5vw,11px);}
  .ppc2__features{grid-template-columns:repeat(2,minmax(0,1fr));gap:21px 12px;margin-top:30px;}
  .ppc2-feature{gap:9px;padding:0;border-left:0 !important;}
  .ppc2-feature>svg,.ppc2-feature>img{width:31px;height:31px;}
  .ppc2-feature h3{font-size:8px;letter-spacing:.08em;}
  .ppc2-feature p{font-size:8px;letter-spacing:.05em;}
}
@media (max-width:350px){
  .ppc2{padding-inline:11px;}
  .ppc2__grid{gap:9px;}
}