/* Gist Compound v1.16 — lightweight premium opening; animation-only, no libraries. */
.ww-opening[hidden]{display:none!important}
.ww-opening{position:fixed;inset:0;z-index:99999;display:grid;place-items:center;isolation:isolate;overflow:hidden;
  background:radial-gradient(ellipse at 45% 30%,#593523 0,#22120f 55%,#100909 100%);color:#fff5e1;
  padding:max(env(safe-area-inset-top),14px) max(env(safe-area-inset-right),12px)
          max(env(safe-area-inset-bottom),12px) max(env(safe-area-inset-left),12px)}
.ww-opening:before{content:"";position:absolute;inset:-45px;z-index:-2;
  background:linear-gradient(#140b0bc4,#170907cc),url("assets/market_back.webp") center/cover no-repeat;
  filter:blur(18px) saturate(1.25);transform:scale(1.1)}
.ww-opening:after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:radial-gradient(circle at 50% 32%,#ffc26030,transparent 55%),
    repeating-linear-gradient(115deg,transparent,transparent 46px,#ffdc9b07 47px,#ffdc9b07 48px)}
.ww-opening-stage{display:flex;align-items:center;justify-content:center;flex-direction:column;gap:clamp(10px,2vh,20px);
 width:min(960px,100%);max-height:100%;position:relative;z-index:2;text-align:center}
.ww-opening-kicker{font-weight:900;font-size:clamp(.68rem,1.7vw,.95rem);text-transform:uppercase;
 letter-spacing:.18em;color:#ffe0a9;opacity:0;animation:ww-intro-rise .65s .12s both}
.ww-opening-poster-frame{position:relative;overflow:hidden;width:min(100%,840px);
 border:3px solid #ffdf9b;border-radius:clamp(16px,3vw,30px);box-shadow:0 0 0 5px #422312,
  0 22px 56px #070202b8,0 0 70px #ff9f334b;aspect-ratio:16/9;opacity:0;
 transform:translateY(24px) scale(.85);animation:ww-intro-cover 1.05s .25s cubic-bezier(.21,1.12,.28,1) both}
.ww-opening-poster{display:block;width:100%;height:100%;object-fit:cover;object-position:center;transform:scale(1.13);
 animation:ww-intro-zoom 4.3s .2s ease-out both}
.ww-opening-light{position:absolute;inset:-55%;width:35%;background:linear-gradient(90deg,transparent,#fff4c872,transparent);
 transform:rotate(19deg) translateX(-600%);mix-blend-mode:screen;pointer-events:none;
 animation:ww-intro-sheen 1.35s 1.2s ease-in-out both}
.ww-opening-text{position:relative;max-width:96%}
.ww-opening-shout{font-size:clamp(1.72rem,5.2vw,3.2rem);line-height:1.09;font-weight:1000;letter-spacing:-.045em;
 color:#ffce61;text-shadow:0 4px 8px #0009;opacity:0;animation:ww-intro-pop .75s 1.05s cubic-bezier(.18,1.45,.3,1) both}
.ww-opening-tagline{margin:.45em 0 0;font-size:clamp(.9rem,2.3vw,1.2rem);font-weight:850;letter-spacing:.03em;
 color:#ffedcf;opacity:0;animation:ww-intro-rise .62s 1.45s both}
.ww-opening-enter{appearance:none;border:0;min-height:50px;min-width:min(290px,90vw);
 padding:13px 24px;background:linear-gradient(#ffeb94,#ffb63f 55%,#f09224);color:#49220f;
 box-shadow:0 6px 0 #9e4c16,0 14px 28px #04020255;border-radius:18px;font-size:clamp(1rem,3vw,1.17rem);
 font-family:inherit;font-weight:1000;cursor:pointer;opacity:0;
 animation:ww-intro-rise .6s 1.85s both}
.ww-opening-enter:hover{filter:brightness(1.08)}
.ww-opening-enter:active{transform:translateY(3px);box-shadow:0 3px 0 #9e4c16}
.ww-opening-skip{appearance:none;border:0;background:none;color:#fff2d4c9;text-decoration:underline;
 text-underline-offset:4px;cursor:pointer;font:700 .85rem system-ui,sans-serif;padding:10px 14px;min-height:40px}
.ww-opening :is(button):focus-visible{outline:3px solid #ffe695;outline-offset:4px}
.ww-opening-spark{position:absolute;pointer-events:none;color:#ffe39e8f;font-size:clamp(24px,5vw,60px);
 filter:drop-shadow(0 0 8px #fbb243b0);animation:ww-intro-spark 2.4s ease-in-out infinite}
.ww-opening-spark-1{left:5%;top:18%}.ww-opening-spark-2{right:8%;top:20%;animation-delay:.5s}
.ww-opening-spark-3{bottom:15%;left:12%;animation-delay:1s}
.ww-opening.ww-opening-exit{animation:ww-intro-out .46s ease-in both;pointer-events:none}
body.ww-opening-visible{overflow:hidden}
@keyframes ww-intro-cover{from{opacity:0;transform:translateY(24px) scale(.85)}to{opacity:1;transform:translateY(0) scale(1)}}
@keyframes ww-intro-pop{0%{opacity:0;transform:translateY(15px) scale(.75)}75%{opacity:1;transform:translateY(0) scale(1.055)}100%{opacity:1;transform:translateY(0) scale(1)}}
@keyframes ww-intro-rise{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}
@keyframes ww-intro-zoom{from{transform:scale(1.13)}to{transform:scale(1)}}
@keyframes ww-intro-sheen{from{transform:rotate(19deg) translateX(-600%)}to{transform:rotate(19deg) translateX(950%)}}
@keyframes ww-intro-spark{0%,100%{opacity:.3;transform:translateY(0) scale(.85)}50%{opacity:.8;transform:translateY(-16px) scale(1.1)}}
@keyframes ww-intro-out{to{opacity:0;transform:scale(1.045);visibility:hidden}}
@media(max-width:600px){
 .ww-opening-stage{gap:clamp(12px,2vh,19px);justify-content:center}
 .ww-opening-poster-frame{width:min(96%,520px);border-width:2px;border-radius:19px;
  box-shadow:0 0 0 3px #53351f,0 14px 40px #000a,0 0 44px #ffae453c}
 .ww-opening-kicker{max-width:285px;line-height:1.6;letter-spacing:.13em}
 .ww-opening-shout{font-size:clamp(1.65rem,7.4vw,2.15rem)}
 .ww-opening-enter{width:min(86%,330px)}
 .ww-opening-spark-1{top:14%;left:6%}.ww-opening-spark-2{top:14%;right:8%}
 .ww-opening-spark-3{bottom:10%}
}
@media(max-height:600px){.ww-opening-stage{gap:7px}.ww-opening-poster-frame{max-height:45vh;width:auto;max-width:80vw}
 .ww-opening-text p{margin-top:0}.ww-opening-enter{min-height:40px;padding:8px 20px}.ww-opening-skip{padding:4px 12px}}
@media(prefers-reduced-motion:reduce){
 .ww-opening *, .ww-opening-spark{animation:none!important;opacity:1!important;transform:none!important;transition:none!important}
 .ww-opening.ww-opening-exit{opacity:0}
}
/* v1.21 Gist Compound cover is 4:3, so keep the logo in frame */
.ww-opening-poster{object-fit:cover;object-position:center top}
.ww-opening-poster-frame{aspect-ratio:4/3}

/* v1.22 · Clean 4:3 hero, fast readable mobile intro */
.ww-opening-stage{overflow:auto;max-height:calc(100dvh - 20px);gap:clamp(7px,1.3vh,12px);scrollbar-width:thin}
.ww-opening-poster-frame{width:min(100%,760px,74dvh);max-height:56dvh;aspect-ratio:4/3;flex-shrink:1}
.ww-opening-poster{object-fit:contain;transform:none;animation:ww-intro-zoom 4.3s .2s ease-out both}
.ww-opening-tagline{max-width:640px;line-height:1.48;margin:6px auto 0;font-size:clamp(.82rem,1.8vw,1.02rem);font-weight:650}
.ww-opening-pills{display:flex;justify-content:center;gap:8px;flex-wrap:wrap;opacity:0;animation:ww-intro-rise .6s 2.05s both}
.ww-opening-pills span{border:1px solid #e4b874a1;background:#fff4cd14;color:#fff2da;padding:6px 13px;border-radius:999px;font-weight:750;font-size:.75rem;letter-spacing:.04em}
.ww-opening-shout{font-size:clamp(1.35rem,4.7vw,2.5rem)}
@media(max-width:600px){.ww-opening-poster-frame{width:min(100%,520px,72dvh);max-height:54dvh}}
@media(max-height:650px){.ww-opening-poster-frame{width:min(100%,520px,61dvh);max-height:46dvh}.ww-opening-pills span{padding:4px 10px}.ww-opening-shout{font-size:clamp(1.2rem,4vw,1.8rem)}}