:root {
  --accent: #e53935;
  --bg: #000;
  --text: #e2e8f0;
}
* {box-sizing:border-box;margin:0;padding:0;}
html,body {
  background:#000;
  color:var(--text);
  font-family: monospace;
  overflow:hidden;
  height:100%;
}
body::before {
  /* лёгкий RGB-глитч слой БЕЗ мерцания */
  content:'';
  position:fixed;
  inset:0;
  background:linear-gradient(90deg, rgba(255,0,0,0.03), rgba(0,255,255,0.03));
  mix-blend-mode:screen;
  pointer-events:none;
  z-index:-1;
}

/* Видео на заднем фоне */
.bg-video {
  position: fixed;
  top: 50%;
  left: 50%;
  min-width: 100%;
  min-height: 100%;
  width: auto;
  height: auto;
  transform: translateX(-50%) translateY(-50%);
  z-index: 0;
  filter: contrast(1.4) brightness(0.3) saturate(1.2) blur(1px);
}

.overlay {
  position:fixed;
  inset:0;
  background:radial-gradient(circle at 50% 50%,rgba(255,255,255,0.02),transparent 60%);
  mix-blend-mode:overlay;
  z-index:-2;
}

h1 {
  font-size:2.6rem;
  text-align:center;
  margin-top:40px;
  letter-spacing:1px;
  text-shadow:0 0 30px rgba(255,0,0,0.4);
  animation: glitchText 1.5s infinite;
}

.subtitle {
  text-align:center;
  color:var(--accent);
  font-size:0.9rem;
  margin-bottom:20px;
  animation: glitchText 1.5s infinite;
}

@keyframes glitchText {
  0%,100% { 
    text-shadow: 2px 0 red, -2px 0 cyan;
    transform: translate(0, 0);
  }
  25% { 
    text-shadow: -2px 0 red, 2px 0 cyan;
    transform: translate(1px, -1px);
  }
  50% { 
    text-shadow: 1px 0 red, -1px 0 cyan;
    transform: translate(-1px, 1px);
  }
  75% { 
    text-shadow: -1px 0 red, 1px 0 cyan;
    transform: translate(0px, -1px);
  }
}

.center-rot {
  position:absolute;
  top:50%;
  left:50%;
  width:180px;
  height:180px;
  transform:translate(-50%,-50%);
  transform-style:preserve-3d;
  border-radius:50%;
  background:radial-gradient(circle at 40% 30%, rgba(255,0,0,0.2), rgba(255,255,255,0.05));
  border:1px solid rgba(255,255,255,0.08);
  box-shadow:0 0 40px rgba(255,0,0,0.3);
  display:flex;
  align-items:center;
  justify-content:center;
  animation:spinY 1.5s linear infinite;
}

@keyframes spinY {
  0% { transform: translate(-50%,-50%) rotateY(0deg) scale(1); }
  25% { transform: translate(-50%,-50%) rotateY(90deg) scale(0.95); }
  50% { transform: translate(-50%,-50%) rotateY(180deg) scale(1.05); }
  75% { transform: translate(-50%,-50%) rotateY(270deg) scale(0.97); }
  100% { transform: translate(-50%,-50%) rotateY(360deg) scale(1); }
}

.logo-img {
  width: 120px;
  height: 120px;
  border-radius: 50%;
  object-fit: contain;
  filter: brightness(1.2) contrast(1.1);
  animation: pulseSize 2s ease-in-out infinite;
}

@keyframes pulseSize {
  0%, 100% { transform: scale(1); }
  50% { transform: scale(1.05); }
}

.star-img {
  position:absolute;
  top:calc(50% - 200px);
  left:calc(50% - 200px);
  width:400px;
  height:400px;
  animation:rotateChaos 10s linear infinite;
  opacity:0.25;
  object-fit: contain;
}

@keyframes rotateChaos {
  from {transform:rotate(0deg);}
  to {transform:rotate(360deg);}
}

/* Стили для летающих логотипов */
.bouncing-logo {
  position: absolute;
  width: 80px;
  height: 80px;
  object-fit: contain;
  opacity: 0.8;
  z-index: 1;
}

/* DVD - классическое движение */
#dvdLogo {
  filter: brightness(0.5) hue-rotate(0deg);
}

@keyframes ciaChaos {
  0%, 100% { transform: rotate(0deg) scale(1); }
  25% { transform: rotate(90deg) scale(1.1); }
  50% { transform: rotate(180deg) scale(0.9); }
  75% { transform: rotate(270deg) scale(1.05); }
}

/* MOSSAD - пульсация + цветовые сдвиги */
#mossadLogo {
  left: 85%;
  top: 20%;
  animation: mossadPulse 4s infinite ease-in-out;
}

@keyframes mossadPulse {
  0% { filter: hue-rotate(0deg) brightness(1); transform: scale(1); }
  33% { filter: hue-rotate(120deg) brightness(1.2); transform: scale(1.15); }
  66% { filter: hue-rotate(240deg) brightness(0.8); transform: scale(0.9); }
  100% { filter: hue-rotate(360deg) brightness(1); transform: scale(1); }
}

/* Microsoft - 3D вращение */
#microsoftLogo {
  left: 15%;
  top: 75%;
  animation: microsoft3D 5s infinite ease-in-out;
  transform-style: preserve-3d;
}

@keyframes microsoft3D {
  0%, 100% { 
    transform: rotateX(0deg) rotateY(0deg) rotateZ(0deg); 
  }
  25% { 
    transform: rotateX(180deg) rotateY(90deg) rotateZ(45deg); 
  }
  50% { 
    transform: rotateX(0deg) rotateY(180deg) rotateZ(90deg); 
  }
  75% { 
    transform: rotateX(270deg) rotateY(270deg) rotateZ(135deg); 
  }
}

/* systemd - масштабирование */
#systemdLogo {
  left: 70%;
  top: 15%;
  animation: systemdFlash 2s infinite steps(2);
}

@keyframes systemdFlash {
  0%, 45% { transform: scale(0.8); }
  50%, 95% { transform: scale(1.2); }
  100% { transform: scale(0.8); }
}

/* GCC - плавное движение волной */
#gccLogo {
  left: 5%;
  top: 45%;
  animation: gccWave 8s infinite ease-in-out;
}

@keyframes gccWave {
  0%, 100% { transform: translate(0, 0) rotate(0deg); }
  25% { transform: translate(20px, -15px) rotate(5deg); }
  50% { transform: translate(-15px, 10px) rotate(-3deg); }
  75% { transform: translate(10px, 20px) rotate(2deg); }
}

/* ExploitDB - агрессивное дрожание + красное свечение */
#exploitdbLogo {
  left: 90%;
  top: 10%;
  animation: exploitShake 0.8s infinite linear;
  filter: brightness(1.3) hue-rotate(350deg) saturate(2);
}

@keyframes exploitShake {
  0%, 100% { transform: translate(0, 0); }
  10% { transform: translate(-1px, -2px); }
  20% { transform: translate(-3px, 0px); }
  30% { transform: translate(3px, 2px); }
  40% { transform: translate(1px, -1px); }
  50% { transform: translate(-1px, 2px); }
  60% { transform: translate(-3px, 1px); }
  70% { transform: translate(3px, 1px); }
  80% { transform: translate(-1px, -1px); }
  90% { transform: translate(1px, 2px); }
}

/* NSA - плавное изменение */
#nsaLogo {
  position:absolute;
  top:calc(50% + 200px);
  left:calc(50% - 50px);
  width:100px;
  height:100px;
  animation: nsaGhost 6s infinite ease-in-out;
}

@keyframes nsaGhost {
  0%, 100% { transform: scale(0.7) blur(1px); }
  25% { transform: scale(1.1) blur(0px); }
  50% { transform: scale(0.8) blur(2px); }
  75% { transform: scale(1) blur(0px); }
}

/* Tor - луковое вращение + фиолетовые оттенки */
#torLogo {
  left: 85%;
  top: 80%;
  animation: torOnion 9s infinite linear;
  filter: hue-rotate(270deg) saturate(1.8);
}

@keyframes torOnion {
  0% { transform: rotate(0deg) scale(1); }
  25% { transform: rotate(90deg) scale(1.1); }
  50% { transform: rotate(180deg) scale(0.9); }
  75% { transform: rotate(270deg) scale(1.05); }
  100% { transform: rotate(360deg) scale(1); }
}

/* fsociety - хаотичные вспышки как взлом */
#fsocietyLogo {
  left: 70%;
  top: 30%;
  animation: fsocietyHack 4s infinite;
  filter: brightness(1.2) contrast(1.3);
}

@keyframes fsocietyHack {
  0%, 15% { transform: scale(1) rotate(0deg); }
  16% { transform: scale(1.4) rotate(10deg); }
  17%, 35% { transform: scale(1) rotate(0deg); }
  36% { transform: scale(1.3) rotate(-5deg); }
  37%, 60% { transform: scale(1) rotate(0deg); }
  61% { transform: scale(1.5) rotate(15deg); }
  62%, 85% { transform: scale(1) rotate(0deg); }
  86% { transform: scale(1.2) rotate(-10deg); }
  87%, 100% { transform: scale(1) rotate(0deg); }
}

.logoText {
  position:absolute;
  bottom:40px;
  width:100%;
  text-align:center;
  font-size:1.1rem;
  color:#aaa;
  animation: glitchText 1.5s infinite;
}

.datastream {
  position:fixed;
  bottom:10px;
  left:10px;
  font-size:0.8rem;
  color:#0f0;
  opacity:0.6;
  height:40px;
  overflow:hidden;
}