/* ===========================================================================
   Écran de démarrage cinématique RSKTV (boot splash).
   Overlay autonome, animations GPU-only (transform/opacity). Se retire via
   js/ui/splash.js (app prête + filet de timeout dur → jamais bloquant).
   =========================================================================== */
#rsk-splash {
  position: fixed; left: 0; top: 0; right: 0; bottom: 0; z-index: 99999;
  display: -webkit-box; display: -webkit-flex; display: flex;
  -webkit-box-orient: vertical; -webkit-flex-direction: column; flex-direction: column;
  -webkit-box-pack: center; -webkit-justify-content: center; justify-content: center;
  -webkit-box-align: center; -webkit-align-items: center; align-items: center;
  background: radial-gradient(circle at 50% 46%, #2a1116 0%, #160a10 36%, #08070b 78%);
  opacity: 1;
  -webkit-transition: opacity .55s ease; transition: opacity .55s ease;
}
#rsk-splash.rsk-splash-out { opacity: 0; pointer-events: none; }

@-webkit-keyframes rsk-pop  {0%{opacity:0;-webkit-transform:scale(.4)}70%{-webkit-transform:scale(1.08)}100%{opacity:1;-webkit-transform:scale(1)}}
@keyframes rsk-pop          {0%{opacity:0;transform:scale(.4)}70%{transform:scale(1.08)}100%{opacity:1;transform:scale(1)}}
@-webkit-keyframes rsk-spin {to{-webkit-transform:rotate(360deg)}}
@keyframes rsk-spin         {to{transform:rotate(360deg)}}
@-webkit-keyframes rsk-spinR{to{-webkit-transform:rotate(-360deg)}}
@keyframes rsk-spinR        {to{transform:rotate(-360deg)}}
@-webkit-keyframes rsk-pulse{0%,100%{-webkit-transform:scale(1)}50%{-webkit-transform:scale(1.06)}}
@keyframes rsk-pulse        {0%,100%{transform:scale(1)}50%{transform:scale(1.06)}}
@-webkit-keyframes rsk-word {0%{opacity:0;-webkit-transform:translateY(16px)}100%{opacity:1;-webkit-transform:translateY(0)}}
@keyframes rsk-word         {0%{opacity:0;transform:translateY(16px)}100%{opacity:1;transform:translateY(0)}}
@-webkit-keyframes rsk-tag  {0%{opacity:0;letter-spacing:16px}100%{opacity:.85;letter-spacing:7px}}
@keyframes rsk-tag          {0%{opacity:0;letter-spacing:16px}100%{opacity:.85;letter-spacing:7px}}
@-webkit-keyframes rsk-fade {to{opacity:1}}
@keyframes rsk-fade         {to{opacity:1}}
@-webkit-keyframes rsk-bar  {0%{width:6%}60%{width:74%}100%{width:96%}}
@keyframes rsk-bar          {0%{width:6%}60%{width:74%}100%{width:96%}}

#rsk-splash .rsk-sp-badge { position: relative; width: 340px; height: 340px; }
#rsk-splash .rsk-sp-badge > svg, #rsk-splash .rsk-sp-disc { position: absolute; left: 0; top: 0; width: 340px; height: 340px; }
#rsk-splash .rsk-sp-hex { opacity: 0; -webkit-animation: rsk-pop .9s cubic-bezier(.2,1,.36,1) .2s forwards; animation: rsk-pop .9s cubic-bezier(.2,1,.36,1) .2s forwards; }
#rsk-splash .rsk-sp-ring1 { opacity: 0; -webkit-transform-origin: 50% 50%; transform-origin: 50% 50%;
  -webkit-animation: rsk-spin 9s linear infinite, rsk-fade .8s ease .5s forwards; animation: rsk-spin 9s linear infinite, rsk-fade .8s ease .5s forwards; }
#rsk-splash .rsk-sp-ring2 { opacity: 0; -webkit-transform-origin: 50% 50%; transform-origin: 50% 50%;
  -webkit-animation: rsk-spinR 6s linear infinite, rsk-fade .8s ease .7s forwards; animation: rsk-spinR 6s linear infinite, rsk-fade .8s ease .7s forwards; }
#rsk-splash .rsk-sp-disc { display: -webkit-box; display: -webkit-flex; display: flex;
  -webkit-box-align: center; -webkit-align-items: center; align-items: center;
  -webkit-box-pack: center; -webkit-justify-content: center; justify-content: center; opacity: 0;
  -webkit-animation: rsk-pop .7s cubic-bezier(.2,1,.36,1) .9s forwards, rsk-pulse 2.4s ease-in-out 1.6s infinite;
  animation: rsk-pop .7s cubic-bezier(.2,1,.36,1) .9s forwards, rsk-pulse 2.4s ease-in-out 1.6s infinite; }
#rsk-splash .rsk-sp-disc .rsk-sp-discbg { width: 120px; height: 120px; border-radius: 50%;
  background: radial-gradient(circle at 38% 32%, #ff3344, #aa0011);
  display: -webkit-box; display: -webkit-flex; display: flex;
  -webkit-box-align: center; -webkit-align-items: center; align-items: center;
  -webkit-box-pack: center; -webkit-justify-content: center; justify-content: center; }

#rsk-splash .rsk-sp-word { margin-top: 26px; font-size: 64px; font-weight: 800; letter-spacing: 3px;
  opacity: 0; -webkit-animation: rsk-word .7s ease 1.5s forwards; animation: rsk-word .7s ease 1.5s forwards; }
#rsk-splash .rsk-sp-word span { color: #fff; }
#rsk-splash .rsk-sp-word .rsk-sp-tv { color: #e50914; }
#rsk-splash .rsk-sp-tag { margin-top: 12px; font-size: 18px; font-weight: 600; color: #9aa3b4; letter-spacing: 7px;
  opacity: 0; -webkit-animation: rsk-tag .9s ease 2.1s forwards; animation: rsk-tag .9s ease 2.1s forwards; }
#rsk-splash .rsk-sp-bar { position: absolute; left: 50%; bottom: 9%; width: 320px; margin-left: -160px; height: 4px;
  background: rgba(255,255,255,.10); border-radius: 3px; overflow: hidden;
  opacity: 0; -webkit-animation: rsk-fade .6s ease 2.4s forwards; animation: rsk-fade .6s ease 2.4s forwards; }
#rsk-splash .rsk-sp-bar > i { display: block; height: 100%; width: 6%; border-radius: 3px;
  background: -webkit-linear-gradient(left, #ff3344, #e50914); background: linear-gradient(90deg, #ff3344, #e50914);
  -webkit-animation: rsk-bar 2.6s cubic-bezier(.4,0,.2,1) 2.4s forwards; animation: rsk-bar 2.6s cubic-bezier(.4,0,.2,1) 2.4s forwards; }