/* PSARI — cinematic gameplay presentation. Larger, themed art stages.
   Does not alter any reel math, wager, or result generation. */
#psari-cinematic{
  padding:12px clamp(10px,3vw,35px);
  gap:clamp(8px,1.1vh,17px);
  background:radial-gradient(ellipse at 50% 39%,#663919,#1b0b16 58%,#06030a 95%)!important;
}
#psari-cinematic::before{
  opacity:.19;filter:blur(15px) saturate(1.13) brightness(.9);
  animation:psari-backdrop-glide 17s ease-in-out infinite alternate;
}
@keyframes psari-backdrop-glide{
  from{transform:scale(1.08) translate3d(-1%,0,0)}
  to{transform:scale(1.14) translate3d(1%,1%,0)}
}
#psari-cinematic .psari-cinematic-stage{
  width:min(87vw,880px);
  height:clamp(245px,53vh,470px);
  flex:0 1 auto;
  border:3px solid #f4d183;
  border-radius:48% 48% 25px 25px/18% 18% 24px 24px;
  box-shadow:inset 0 0 0 3px #8a421a,inset 0 0 42px #0009,0 0 0 1px #623516,0 0 35px #e8a94c73,0 18px 55px #010107;
  background:#1d0d14;
  animation:psari-feature-stage-reveal .85s cubic-bezier(.19,.8,.22,1) both;
}
@keyframes psari-feature-stage-reveal{
 from{opacity:0;transform:translateY(27px) scale(.95);filter:brightness(1.4)}
 to{opacity:1;transform:translateY(0) scale(1);filter:brightness(1)}
}
#psari-cinematic .psari-cinematic-stage::after{
 content:'';position:absolute;inset:0;z-index:9;pointer-events:none;
 border-radius:inherit;
 background:linear-gradient(180deg,#ffe5a63a 0%,transparent 13%,transparent 78%,#08030985 100%);
 box-shadow:inset 0 0 48px 12px #0d020c80;
}
#psari-cinematic .cinematic-frame{
 width:min(95vw,930px);padding:0 14px 7px!important;
 background:transparent!important;filter:drop-shadow(0 1px 5px #000c);
}
#psari-cinematic .cinematic-frame h2{
 font-size:clamp(32px,5vw,61px)!important;letter-spacing:.08em;
 text-shadow:0 2px 0 #713d1a,0 6px 14px #000f,0 0 36px #f2bc4a78;
 animation:psari-title-glint 2.8s ease-in-out infinite alternate;
}
@keyframes psari-title-glint{from{filter:brightness(.95)}to{filter:brightness(1.11)}}
#psari-cinematic .cinematic-frame p{letter-spacing:.13em;color:#f9e1af}
#psari-cinematic .cinematic-frame button{
 min-width:175px;padding:13px 27px;border:2px solid #f7cc78;
 background:linear-gradient(180deg,#986024,#572211 45%,#170913);
 box-shadow:inset 0 1px 0 #ffeabb99,0 6px 0 #422011,0 11px 23px #050107b9;
}
#psari-cinematic .cinematic-frame button:hover{filter:brightness(1.15)}
/* Savannah: golden sunrise, deep layer parallax, and living rays. */
#psari-cinematic[data-mode="savannah"] .psari-scene-savannah{
 background:linear-gradient(180deg,#25111c05,#f3bb4a18 55%,#4b1f24a9 100%),
 url('assets/savannah-horizon.webp') center 49%/cover no-repeat;
 animation:psari-savannah-camera 10s linear both;
}
@keyframes psari-savannah-camera{
 from{background-position:center 47%;filter:saturate(1)}
 to{background-position:center 53%;filter:saturate(1.2)}
}
#psari-cinematic[data-mode="savannah"] .psari-scene-savannah::before{
 content:'';position:absolute;inset:-16%;pointer-events:none;
 background:repeating-conic-gradient(from 0deg at 50% 42%,transparent 0deg 13deg,#fff3c522 16deg 23deg,transparent 27deg 36deg);
 opacity:.52;mix-blend-mode:screen;
 animation:psari-sun-rays-spin 13s linear infinite;
}
@keyframes psari-sun-rays-spin{to{transform:rotate(29deg)}}
#psari-cinematic[data-mode="savannah"] .psari-scene-savannah::after{
 background:linear-gradient(180deg,transparent 0%,#f3ca6320 62%,#2b0a24b4 100%);
}
/* Lion's Dominion: the original lion portrait, with its CROWN visible.
   Prior version clipped off the crown and showed only its torso. */
#psari-cinematic[data-mode="dominion"] .psari-scene-dominion{
 background:radial-gradient(circle at 50% 26%,#b56a377a,#431f25 55%,#1c0a17 100%);
}
#psari-cinematic[data-mode="dominion"] .psari-scene-portrait{
 display:block!important;
 position:absolute;z-index:4;
 left:50%!important;top:52%!important;
 width:auto!important;height:95%!important;
 max-width:none!important;
 object-fit:contain!important;object-position:center top!important;
 opacity:1!important;
 mask-image:linear-gradient(180deg,#000 0%,#000 65%,transparent 99%)!important;
 -webkit-mask-image:linear-gradient(180deg,#000 0%,#000 65%,transparent 99%)!important;
 filter:drop-shadow(0 0 18px #efb86b9c) brightness(1.04)!important;
 animation:psari-lion-full-entry 1.05s cubic-bezier(.19,.77,.23,1) both!important;
}
@keyframes psari-lion-full-entry{
 0%{opacity:0;transform:translate(-50%,-39%) scale(1.17);filter:brightness(2)}
 100%{opacity:1;transform:translate(-50%,-50%) scale(1)}
}
#psari-cinematic[data-mode="dominion"] .psari-locked-wild{
 display:block;top:47%;width:clamp(65px,8vw,108px);
 filter:drop-shadow(0 0 23px #ffe19a);
}
/* Stampede: an animated foreground herd as a subordinate layer,
   not enlarged symbol cards posing as full artwork. */
#psari-cinematic[data-mode="stampede"] .psari-scene-stampede{
 background:linear-gradient(180deg,#4c140a2e,#a24d2426 46%,#1c0a15bd),
 url('assets/savannah-horizon.webp') center 49%/cover no-repeat;
 animation:psari-stampede-camera 5.4s cubic-bezier(.11,.58,.31,.88) both;
}
@keyframes psari-stampede-camera{
 from{background-size:104% auto;filter:brightness(.8)}
 to{background-size:119% auto;filter:brightness(1.15)}
}
#psari-cinematic[data-mode="stampede"] .psari-animal{
 display:block!important;opacity:.48!important;
 top:68%;height:clamp(76px,15vh,128px);width:clamp(76px,11vw,140px);
 filter:brightness(.06) sepia(1) saturate(2) drop-shadow(0 0 8px #dd884c)!important;
 mix-blend-mode:multiply;
 animation:psari-herd-entrance 2.1s cubic-bezier(.17,.68,.25,1) both!important;
}
#psari-cinematic[data-mode="stampede"] .psari-animal.rhino{left:5%;animation-delay:.18s!important}
#psari-cinematic[data-mode="stampede"] .psari-animal.elephant{left:47%;animation-delay:.0s!important}
#psari-cinematic[data-mode="stampede"] .psari-animal.zebra{right:5%;animation-delay:.25s!important}
@keyframes psari-herd-entrance{
 0%{opacity:0;transform:translate3d(-80px,40px,0) scale(.7)}
 65%{opacity:.5;transform:translate3d(5px,-3px,0) scale(1.05)}
 100%{opacity:.42;transform:translate3d(0,0,0) scale(1)}
}
#psari-cinematic[data-mode="stampede"] .psari-stampede-dust{opacity:.74}
#psari-cinematic[data-mode="stampede"] .psari-stampede-trail{height:85px}
#psari-cinematic .psari-scene-ring{z-index:1}
/* Feature HUD: show genuine active bonus, not a debug progress counter. */
.psari-feature-hud .psari-feature-mode{font-size:14px;letter-spacing:.04em}
.psari-feature-counter{color:#fff1d2}
/* Pot reveal: three embossed prize vessels instead of flat text rectangles. */
.psari-pot-reveal .pot-reveal-card{
 position:relative;isolation:isolate;
 border:3px solid #e6b870;border-radius:30px 30px 58px 58px/23px 23px 75px 75px;
 background:radial-gradient(ellipse at 34% 20%,#e8c17f 0%,#b57230 18%,#663018 57%,#2b140d 88%);
 box-shadow:inset 9px 0 14px #fff2b23b,inset -12px -6px 22px #160907b9,0 17px 22px #050308b9,0 0 17px #e0a74a85;
 font:900 clamp(14px,1.7vw,23px) Georgia,serif;text-shadow:0 2px 3px #2c120a;
 letter-spacing:.04em;
}
.psari-pot-reveal .pot-reveal-card::before{
 content:'♛';font:900 29px Georgia,serif;position:absolute;left:50%;top:11%;
 transform:translateX(-50%);color:#ffeebf;text-shadow:0 0 13px #ffda7a;
}
.psari-pot-reveal .pot-reveal-card[data-pot="silver"]{
 background:radial-gradient(ellipse at 34% 20%,#fff5dd,#c7b8ab 21%,#665f69 60%,#27262d);
}
.psari-pot-reveal .pot-reveal-card[data-pot="gold"]{
 background:radial-gradient(ellipse at 34% 20%,#fffbe3,#f8c65c 20%,#9a4f15 60%,#361007);
}
.psari-pot-reveal .pot-reveal-card.selected{
 animation:pot-detonate 1s ease-out;
 box-shadow:inset 0 0 30px #ffe19880,0 0 0 4px #f9dc8b54,0 0 80px #ff9c2baf;
}
/* Credits are banked at the time of each actual demo tumble. */
.credit-readout [data-balance],.mobile-metrics [data-balance]{
 font-variant-numeric:tabular-nums;
 text-shadow:0 0 8px #f4c56960;
}
.psari-credit-details{font-size:11px;letter-spacing:.02em;color:#ffe6a7}
@media(max-width:760px){
 #psari-cinematic .psari-cinematic-stage{
  width:95vw;height:clamp(215px,39vh,340px);
  border-radius:26px;
 }
 #psari-cinematic .cinematic-frame{width:96vw!important}
 #psari-cinematic .cinematic-frame h2{font-size:clamp(32px,8vw,49px)!important}
 #psari-cinematic .psari-scene-portrait{height:95%!important;top:52%!important}
 #psari-cinematic[data-mode="dominion"] .psari-locked-wild{width:min(19vw,72px);top:54%}
 #psari-cinematic[data-mode="stampede"] .psari-animal{width:min(22vw,90px);height:75px}
 .psari-credit-details{font-size:10px}
}
@media(prefers-reduced-motion:reduce){
 #psari-cinematic::before,#psari-cinematic .psari-cinematic-stage,
 #psari-cinematic .cinematic-frame h2,
 #psari-cinematic .psari-scene-savannah::before,
 #psari-cinematic .psari-scene-savannah,
 #psari-cinematic .psari-scene-stampede,
 #psari-cinematic .psari-scene-portrait,
 #psari-cinematic .psari-animal{animation:none!important}
 #psari-cinematic .psari-scene-portrait{transform:translate(-50%,-50%)!important}
}

/* Final art-edge correction: remove portrait rectangle, keep original crown visible. */
#psari-cinematic[data-mode="dominion"] .psari-scene-dominion:before{
 background:url('assets/lion-portrait.webp') center 34%/cover no-repeat!important;
 opacity:.66!important;filter:blur(18px) saturate(.85) brightness(.55)!important;
}
#psari-cinematic[data-mode="dominion"] .psari-scene-portrait{
 mask-image:radial-gradient(ellipse 50% 74% at 50% 45%,#000 42%,#000c 58%,transparent 100%)!important;
 -webkit-mask-image:radial-gradient(ellipse 50% 74% at 50% 45%,#000 42%,#000c 58%,transparent 100%)!important;
}
#psari-cinematic[data-mode="dominion"] .psari-scene-dominion:after{
 content:'';position:absolute;z-index:6;inset:0;pointer-events:none;
 background:radial-gradient(ellipse at 50% 48%,transparent 23%,#2609163d 63%,#0c040bab 100%);
}

/* Fix the panorama's 918×310 source ratio. Previous 104%-width animation
   exposed dark horizontal letterbox bands inside the 830×440 feature stage. */
#psari-cinematic[data-mode="stampede"] .psari-scene-stampede{
 background:linear-gradient(180deg,#4c140a2e,#a24d2426 46%,#1c0a15bd),
 url('assets/savannah-horizon.webp') center/cover no-repeat!important;
 animation:none!important;
}
#psari-cinematic[data-mode="stampede"] .psari-scene-stampede::before{
 content:'';position:absolute;inset:0;z-index:1;pointer-events:none;
 background:url('assets/savannah-horizon.webp') center/100% auto no-repeat;
 filter:saturate(1.1) brightness(.9);
 animation:psari-stampede-pan 8s ease-in-out infinite alternate;
}
@keyframes psari-stampede-pan{
 from{transform:scale(1.01) translateY(-1%);opacity:.85}
 to{transform:scale(1.09) translateY(1%);opacity:1}
}
#psari-cinematic[data-mode="stampede"] .psari-stampede-dust{z-index:3}
#psari-cinematic[data-mode="stampede"] .psari-animal{z-index:4}
#psari-cinematic[data-mode="stampede"] .psari-stampede-trail{z-index:5}
@media(prefers-reduced-motion:reduce){
 #psari-cinematic[data-mode="stampede"] .psari-scene-stampede::before{animation:none!important}
}
/* Keep one full-bleed image: the contained duplicate created a visible seam. */
#psari-cinematic[data-mode="stampede"] .psari-scene-stampede::before{display:none!important}
#psari-cinematic[data-mode="stampede"] .psari-stampede-trail{height:34px!important;background:linear-gradient(0deg,#7238183d,transparent)!important}
#psari-cinematic[data-mode="stampede"] .psari-scene-stampede::after{background:linear-gradient(180deg,transparent 0%,#de8c3712 72%,#76350d33 100%)!important}
/* Symbol tiles contain square backplates; they must NOT appear as rectangular
   silhouettes over the full-screen stampede illustration. */
#psari-cinematic[data-mode="stampede"] .psari-animal{display:none!important}
