/* Z: demo layer styles (splash, presenter, transitions). Owner: Z. Uses brand.css tokens + .jf-btn. */
#jf-splash{position:fixed;inset:0;z-index:20;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:22px;
 background:linear-gradient(180deg,#F3FBFF 0,#E6F7F4 100%);overflow:hidden;font-family:Fredoka,system-ui,sans-serif;color:#45251E;text-align:center;padding:24px;box-sizing:border-box}
#jf-splash .logo{background:#D2232A;border-radius:26px;box-shadow:0 6px 0 #A50F1E;padding:14px 28px 10px;max-width:92vw}
#jf-splash .logo b{display:block;color:#fff;font-weight:800;font-size:clamp(34px,9vw,72px);letter-spacing:.02em;-webkit-text-stroke:2px #45251E;paint-order:stroke fill;line-height:1.05}
#jf-splash .logo i{display:inline-block;font-style:normal;background:#FFC21A;border-radius:99px;padding:2px 22px;margin-top:6px;font-weight:800;font-size:clamp(18px,4.5vw,32px)}
#jf-splash .cups{height:clamp(90px,22vh,190px);display:flex;align-items:flex-end;gap:2vw}
#jf-splash .cups img{height:100%;width:auto;object-fit:contain}
#jf-splash .cups img:nth-child(odd){height:78%}
#jf-splash .bar{width:min(320px,76vw);height:18px;border-radius:9px;background:#fff;border:3px solid #45251E;overflow:hidden}
#jf-splash .bar span{display:block;height:100%;width:0;background:#E5007E;transition:width .15s}
#jf-splash .pct{font-weight:700;font-size:18px;min-height:24px}
#jf-splash .jf-btn{min-width:220px;min-height:56px;font-size:24px;visibility:hidden}
#jf-splash.ready .jf-btn{visibility:visible}
#jf-splash.out{opacity:0;transition:opacity .35s}
.jf-rm #jf-splash.out{transition:none}
#jf-pbadge{position:fixed;left:50%;transform:translateX(-50%);top:max(6px,env(safe-area-inset-top));z-index:4;display:none;min-height:44px;padding:0 12px;border-radius:22px;border:3px solid #fff;
 background:#45251E;color:#fff;font:700 16px Fredoka,system-ui,sans-serif;box-shadow:0 3px 0 rgba(0,0,0,.25);cursor:pointer}
.jf-presenter #jf-pbadge{display:block}
.jf-ingame #jf-pbadge{display:none!important}
#jf-pdlg{position:fixed;inset:0;z-index:30;display:none;align-items:center;justify-content:center;background:rgba(0,87,184,.6);font-family:Fredoka,system-ui,sans-serif}
#jf-pdlg.on{display:flex}
#jf-pdlg .card{background:#FFF8EC;border-radius:22px;border:4px solid #FFC21A;padding:22px;width:min(440px,92vw);box-sizing:border-box;color:#45251E;text-align:center}
#jf-pdlg h2{margin:0 0 6px;font-size:26px}#jf-pdlg p{margin:0 0 16px;font-size:17px;line-height:1.35}
#jf-pdlg .row{display:flex;flex-direction:column;gap:10px}#jf-pdlg .jf-btn{min-height:52px;width:100%;font-size:19px}

.jf-ic{width:1.1em;height:1.1em;vertical-align:-.18em;margin-right:.25em;fill:currentColor}

/* P: concept E - pale sky-mint, soft light rays, gelatin mold shapes at the edges */
#jf-splash>*{position:relative;z-index:2}
#jf-splash::before{content:"";position:absolute;inset:-30%;z-index:0;background:repeating-conic-gradient(from 0deg at 50% 46%,rgba(255,255,255,.75) 0 9deg,rgba(255,255,255,0) 9deg 22deg)}
#jf-splash::after{content:"";position:absolute;inset:0;z-index:0;background:radial-gradient(55% 22% at 50% 46%,rgba(255,255,255,.95),transparent 70%)}
#jf-splash .jf-sbg{position:absolute;inset:0;z-index:1;pointer-events:none}
.jf-sbg svg,#jf-splash .jf-sbg svg{position:absolute;width:clamp(70px,20vmin,190px);height:auto;opacity:.55;transform-origin:50% 100%;animation:jfMold 5s ease-in-out infinite}
.jf-sbg svg:nth-child(2n),#jf-splash .jf-sbg svg:nth-child(2n){animation-duration:6.2s;animation-delay:-2s}
.jf-sbg svg:nth-child(3n),#jf-splash .jf-sbg svg:nth-child(3n){animation-duration:7s;animation-delay:-4s}
@keyframes jfMold{0%,100%{transform:scale(1,1)}50%{transform:scale(1.04,.96)}}
@media (prefers-reduced-motion:reduce){.jf-sbg svg,#jf-splash .jf-sbg svg{animation:none}}
.jf-rm .jf-sbg svg,#jf-splash .jf-sbg svg{animation:none}
#jf-splash .jf-stheme{position:absolute;inset:0;z-index:0;pointer-events:none;opacity:1;transition:opacity .4s ease}
.jf-rm #jf-splash .jf-stheme{transition:none}
#jf-splash .jf-stheme.out{opacity:0}
.jf-sbg .jf-acc,#jf-splash .jf-sbg .jf-acc{width:clamp(28px,8vmin,64px);opacity:.4;animation:none}
#jf-splash .cups{filter:drop-shadow(0 12px 14px rgba(69,37,30,.28))}
#jf-splash .pct{background:#fff;border-radius:99px;padding:2px 14px}
