.oj-splash {
  --oj-ring:min(340px,84vw,47svh);
  position:fixed; z-index:2147483000; inset:0;
  display:grid; place-items:center; min-height:100vh; min-height:100dvh;
  box-sizing:border-box; isolation:isolate; overflow:hidden;
  padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);
  color:#fff5ff; background:radial-gradient(ellipse at 50% 40%,#311244 0%,#190922 44%,#100516 75%);
  font-family:Inter,system-ui,sans-serif; text-align:center;
  transition:opacity 240ms ease; overscroll-behavior:none;
}
.oj-splash[data-exit=true] { opacity:0; pointer-events:none; }
.oj-splash::before,.oj-splash::after { content:''; position:absolute; z-index:-1; pointer-events:none; width:min(105vw,640px); height:min(48vw,270px); border-radius:50%; }
.oj-splash::before { left:-38%; top:-6%; transform:rotate(-28deg); border-bottom:1px solid #d178f5a0; box-shadow:0 2px 12px #a536dd80,0 15px 30px -21px #ff824f,inset 0 -10px 27px -20px #f678dc; }
.oj-splash::after { right:-31%; bottom:-6%; transform:rotate(-28deg); border-top:1px solid #f48370c4; box-shadow:0 -2px 11px #ff874b73,0 -16px 31px -23px #e63ad8,inset 0 9px 24px -17px #952fe1; }
.oj-splash-wave { position:absolute; z-index:-1; inset:auto -4% -5% -4%; height:24%; opacity:.22; background-image:radial-gradient(circle,#c793e6 0 .8px,transparent 1.2px); background-size:10px 10px; mask-image:radial-gradient(ellipse at 60% 105%,#000 5%,transparent 69%); transform:rotate(-7deg); }
.oj-splash-content { width:min(100%,480px); display:flex; flex-direction:column; align-items:center; }
.oj-splash-orbit { position:relative; width:var(--oj-ring); aspect-ratio:1; display:grid; place-items:center; }
.oj-splash-ring { position:absolute; inset:0; border:1px solid #ba72e652; border-radius:50%; }
.oj-splash-ring::after { content:''; position:absolute; inset:11.7%; border:1px solid #ba72e628; border-radius:50%; }
.oj-splash-rotor { position:absolute; inset:0; border-radius:50%; animation:oj-splash-orbit 4s linear infinite; }
.oj-splash-rotor::after { content:''; position:absolute; inset:0; border-radius:50%; background:conic-gradient(from -34deg,transparent 0,#fac4657a 30deg,transparent 35deg); mask:radial-gradient(farthest-side,transparent calc(100% - 3px),#000 calc(100% - 2px),transparent); }
.oj-splash-star { display:block; width:17px; height:21px; background:linear-gradient(145deg,#fff9dd,#ffd576 55%,#e9a734); clip-path:polygon(50% 0,62% 37%,100% 50%,62% 63%,50% 100%,38% 63%,0 50%,38% 37%); }
.oj-splash-star-glow { position:absolute; left:50%; top:0; transform:translate(-50%,-50%); filter:drop-shadow(0 0 7px #ffca70); z-index:1; }
.oj-splash-star-glow .oj-splash-star { animation:oj-splash-twinkle 4s ease-in-out infinite; }
.oj-splash-logo { display:block; width:46%; aspect-ratio:1; height:auto; object-fit:contain; border:1px solid #fff5; border-radius:21%; background:#fff; box-shadow:0 0 33px #b443eb63,0 0 7px #ffb5d15c; animation:oj-splash-breathe 3s ease-in-out infinite; }
.oj-splash-static .oj-splash-logo { animation:oj-splash-enter 500ms ease-out both,oj-splash-breathe 3s 500ms ease-in-out infinite; }
.oj-splash-brand { display:block; margin:-1% 0 0; font-size:clamp(28px,9.4vw,48px); font-weight:850; line-height:1.1; letter-spacing:.085em; text-indent:.085em; color:#fff3ff; text-shadow:0 3px 24px #b744db78; }
.oj-splash-tagline { display:block; margin:7px 0 0; font-size:clamp(8px,2.35vw,11px); font-weight:650; letter-spacing:.17em; text-indent:.17em; color:#ddc7ea; }
.oj-splash-state { margin:clamp(16px,4vh,33px) 0 10px; min-height:1.3em; font-size:13px; line-height:1.3; color:#e6cfef; animation:oj-splash-enter 230ms ease-out both; }
.oj-splash-progress { position:relative; width:min(72vw,350px); height:3px; border-radius:4px; background:#462952; }
.oj-splash-segment { position:absolute; left:0; top:0; width:100%; height:100%; transform:translateX(calc(var(--oj-progress, 0) * 1% - 100%)); transition:transform 240ms ease; }
.oj-splash-segment::before { content:''; position:absolute; inset:0; border-radius:inherit; background:linear-gradient(90deg,#a100ff,#e52abf,#ff6a52,#ffb347); clip-path:inset(0 round 3px); }
.oj-splash-progress[data-pending=true] .oj-splash-segment { width:26%; animation:oj-splash-scan 1.8s ease-in-out infinite alternate; }
.oj-splash-progress[data-pending=false] { clip-path:inset(-12px -12px -12px 0); }
.oj-splash-progress .oj-splash-star-glow { left:100%; top:50%; }
.oj-splash-progress .oj-splash-star { width:10px; height:12px; animation:none; }
.oj-splash-percent { margin-top:9px; color:#dec4eb; font-size:11px; font-variant-numeric:tabular-nums; }
.oj-splash-retry { border:1px solid #b96bd9; border-radius:20px; background:#341746; color:#fff4ff; min-height:44px; padding:0 18px; cursor:pointer; font:650 13px Inter,system-ui,sans-serif; }
.oj-splash-retry[hidden],.oj-splash-progress[hidden] { display:none; }
.oj-splash-retry:focus-visible { outline:2px solid #ffd576; outline-offset:3px; }
@keyframes oj-splash-orbit { to { transform:rotate(360deg); } }
@keyframes oj-splash-twinkle { 0%,100% { opacity:.8; transform:scale(.88); } 46%,56% { opacity:1; transform:scale(1.08); } }
@keyframes oj-splash-enter { from { opacity:0; transform:scale(.94); } to { opacity:1; transform:scale(1); } }
@keyframes oj-splash-breathe { 0%,100% { transform:scale(1); } 50% { transform:scale(1.025); } }
@keyframes oj-splash-scan { from { transform:translateX(0); } to { transform:translateX(284%); } }
@media(prefers-reduced-motion:reduce) {
  .oj-splash,.oj-splash *,.oj-splash *::before,.oj-splash *::after { animation:none!important; transition:none!important; }
  .oj-splash-progress[data-pending=true] .oj-splash-segment { transform:translateX(140%); }
}
