/* FeniksFit — splash.css: заставка FeniksFit */
#splash{--f1:#fff3c4;--f2:#ffd36b;--f3:#ff8a1f;--f4:#e8371b;--f5:#7a0f3a;--bg:#07080c;z-index:50;font-family:Unbounded,system-ui,sans-serif;color:#eef0f5;position:fixed;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;cursor:pointer;
  background:radial-gradient(70vmin 55vmin at 50% 46%,rgba(255,110,30,.10),transparent 70%),var(--bg)}
#splash #spFx{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
#splash #spStage{position:relative;z-index:1;height:min(54vmin,640px);aspect-ratio:1151/1367;margin-top:7vmin}
#splash #spStage .rings,#splash #spStage .bird,#splash #spStage .pl{position:absolute;inset:0;width:100%;height:100%}
#splash #spStage .rings{overflow:visible;filter:drop-shadow(0 0 1vmin rgba(255,110,30,.8))}
#splash .glow{position:absolute;left:50%;top:46.82%;width:120%;aspect-ratio:1;transform:translate(-50%,-50%);border-radius:50%;
  background:radial-gradient(closest-side,rgba(255,120,30,.32),rgba(232,55,27,.10) 55%,transparent);opacity:0;animation:sp-fadeIn 1.5s ease 1.2s forwards,sp-halo 3.2s ease-in-out 2.7s infinite}
@keyframes sp-halo{0%,100%{opacity:.7}50%{opacity:1}}
/* огненный круг-маховик: рисуется первым, из него появляется феникс */
#splash .ring{transform-origin:575px 640px;animation:sp-spin 22s linear .2s infinite}
#splash .draw{stroke-dasharray:1;stroke-dashoffset:1;animation:sp-draw 1.1s ease-in-out .15s forwards}
#splash .dash{opacity:0;animation:sp-fadeIn 1s ease .9s forwards}
@keyframes sp-draw{to{stroke-dashoffset:0}}
@keyframes sp-spin{to{transform:rotate(360deg)}}
#splash .portal{transform-origin:575px 640px;opacity:0;animation:sp-portal 1.4s ease .4s forwards,sp-halo 3s ease-in-out 2s infinite}
@keyframes sp-portal{0%{opacity:0;transform:scale(.3)}60%{opacity:1;transform:scale(1.05)}100%{opacity:.8;transform:scale(1)}}
#splash .flash{transform-origin:575px 640px;transform:scale(0);opacity:0;animation:sp-flash 1.1s ease-out 1s forwards}
@keyframes sp-flash{0%{transform:scale(.1);opacity:1}100%{transform:scale(3.4);opacity:0}}
@keyframes sp-fadeIn{to{opacity:1}}
/* феникс медленно вырастает из центра круга, раскалённый добела → остывает до своих цветов */
#splash .bird{transform-origin:50% 46.82%;opacity:0;
  animation:sp-emerge 2.6s cubic-bezier(.25,.8,.3,1) 1s forwards, sp-breath 4s ease-in-out 3.8s infinite}
/* только прозрачность и масштаб — без CSS-фильтров, чтобы цвет картинки не менялся (белый жар — внутри WebGL) */
@keyframes sp-emerge{0%{opacity:0;transform:scale(.05)}20%{opacity:1}100%{opacity:1;transform:scale(1)}}
@keyframes sp-breath{0%,100%{transform:translateY(0)}50%{transform:translateY(-.8%)}}
#splash .diag{position:absolute;left:1.5vmin;bottom:1.2vmin;font:400 11px system-ui,sans-serif;letter-spacing:0;color:#5c6372;z-index:2}
/* холст больше картинки на 15% с каждой стороны — запас под складывание и взмахи крыльев */
#splash .bird .gl{position:absolute;left:-15%;top:-15%;width:130%;height:130%}
#splash .bird .fallback{position:absolute;inset:0;width:100%;height:100%}
/* надпись */
#splash #spWord{position:relative;z-index:1;margin-top:1vmin;font-weight:800;font-size:min(8.6vmin,100px);letter-spacing:.06em;line-height:1;display:flex}
#splash #spWord i{font-style:normal;display:inline-block;opacity:0;animation:sp-letter .7s cubic-bezier(.2,.8,.2,1) forwards;animation-delay:calc(3.2s + var(--i)*80ms)}
@keyframes sp-letter{from{opacity:0;transform:translateY(3vmin);filter:blur(10px)}to{opacity:1;transform:none;filter:none}}
#splash #spFit{background:linear-gradient(100deg,var(--f3) 0%,var(--f2) 25%,var(--f1) 33%,var(--f2) 41%,var(--f3) 60%,var(--f4) 100%);background-size:260% 100%;
  -webkit-background-clip:text;background-clip:text;color:transparent;
  animation:sp-reveal 1s cubic-bezier(.2,.8,.2,1) 3.8s both, sp-shine 4.5s ease-in-out 4.8s infinite}
@keyframes sp-reveal{from{clip-path:inset(0 100% 0 0);filter:blur(8px)}to{clip-path:inset(-20% -10% -20% 0);filter:none}}
@keyframes sp-shine{0%{background-position:100% 0}55%,100%{background-position:-60% 0}}
#splash #spTag{position:relative;z-index:1;margin-top:2vmin;font-weight:300;font-size:min(2.4vmin,26px);letter-spacing:.42em;text-transform:uppercase;color:#a9b0c2;opacity:0;animation:sp-fadeUp 1.2s ease 4.6s forwards}
@keyframes sp-fadeUp{from{opacity:0;transform:translateY(1.5vmin)}to{opacity:1;transform:none}}
/* приглашение продолжить: появляется, когда анимация раскрылась; заставка ждёт касания */
#splash #spHint{position:absolute;bottom:3.5vmin;z-index:1;display:flex;align-items:center;gap:1.6vmin;opacity:0;pointer-events:none;
  font-weight:300;font-size:min(2.1vmin,22px);letter-spacing:.24em;text-transform:uppercase;color:#cfd4e0}
#splash.ready #spHint{animation:sp-fadeUp 1s ease forwards}
#splash #spHint .tap{position:relative;width:min(3.6vmin,38px);height:min(3.6vmin,38px);flex:none}
#splash #spHint .tap::before,#splash #spHint .tap::after{content:"";position:absolute;inset:0;border-radius:50%;border:2px solid var(--f2)}
#splash #spHint .tap::before{inset:28%;background:var(--f2);border:0;box-shadow:0 0 1.4vmin var(--f3)}
#splash #spHint .tap::after{animation:sp-ping 1.8s ease-out infinite}
@keyframes sp-ping{0%{transform:scale(.35);opacity:1}100%{transform:scale(1.25);opacity:0}}
#splash #spHint .txt{animation:sp-blink 2.6s ease-in-out 1s infinite}
@keyframes sp-blink{50%{opacity:.45}}
#splash.out{animation:sp-out .7s ease forwards}
@keyframes sp-out{to{opacity:0;transform:scale(1.04);filter:blur(6px)}}
/* экран ожидания перед заставкой (нужен браузеру, чтобы разрешить звук) */
#spGate{position:fixed;inset:0;z-index:60;background:radial-gradient(70vmin 60vmin at 50% 38%,#2a120c,#05060a 70%);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2.4vmin;cursor:pointer;font-family:Unbounded,system-ui,sans-serif}
#spGate .gBird{height:min(52vh,560px);width:auto;filter:drop-shadow(0 0 4vmin #ff5a1a66);animation:gFloat 5s ease-in-out infinite;pointer-events:none;user-select:none}
@keyframes gFloat{50%{transform:translateY(-1.2vmin);filter:drop-shadow(0 0 6vmin #ff6a1a99)}}
#spGate .gWord{font-weight:800;font-size:min(7vmin,80px);letter-spacing:.06em;color:#eef0f5;line-height:1}
#spGate .gWord b{background:linear-gradient(100deg,#ffd36b,#ff8a1f 50%,#e8371b);-webkit-background-clip:text;background-clip:text;color:transparent}
#spGate .gBrand{font-size:min(3.4vmin,34px);padding-top:1.2vmin;border-top:1px solid #ffffff22}#spGate .gBrand .brName{color:#c9ced8}
#spGate .gTap{display:flex;align-items:center;gap:2vmin;margin-top:3vmin}
#spGate .gEmber{width:3.2vmin;height:3.2vmin;border-radius:50%;background:radial-gradient(#fff3c4,#ff8a1f 45%,#e8371b 70%,transparent 72%);
  box-shadow:0 0 4vmin 1vmin #ff6a1a88,0 0 12vmin 4vmin #ff6a1a33;animation:gPulse 2.4s ease-in-out infinite}
@keyframes gPulse{50%{transform:scale(1.35);box-shadow:0 0 6vmin 2vmin #ff6a1aaa,0 0 16vmin 6vmin #ff6a1a44}}
#spGate .gTxt{font:300 min(2.2vmin,22px) Unbounded,system-ui,sans-serif;letter-spacing:.32em;text-transform:uppercase;color:#8b93a7;animation:gBlink 2.4s ease-in-out infinite}
@keyframes gBlink{50%{opacity:.4}}