.::humanRaCcoOn::.

🛠️ Stylus Script

/* ==UserStyle==
@name         YouTube OG Xbox Dashboard
@namespace    xbox2001.youtube
@version      20260213
@description  YouTube but it's running on a 2001 Xbox
==/UserStyle== */

@-moz-document domain("youtube.com"), regexp("http(s?)://[^/]*\.youtube(\.com)?(\.[a-z][a-z])?/.*"), regexp("http(s?)://youtube(\.com)?(\.[a-z][a-z])?/.*") {

@import url('https://fonts.googleapis.com/css2?family=Orbitron:wght@400;500&family=Rajdhani:wght@400;500&display=swap');

/* =========================
     GLOBAL XBOX VARIABLES
     ========================= */

html, body, ytd-app {

--xbox-bg-dark: #0b140f;
    --xbox-bg-mid: #13261c;
    --xbox-panel: #1c3326;
    --xbox-glow: #5cff3a;
    --xbox-glow-soft: #b4ff9a;
    --xbox-text: #caffc1;

background: radial-gradient(circle at center, #163524 0%, #0b140f 60%) !important;
    color: var(--xbox-text) !important;
  }
    
    /* =========================
   OG XBOX BACKGROUND WALLPAPER
   ========================= */
html, body, ytd-app {
  background: 
    url("https://wallpapercave.com/wp/wp9746593.jpg")
      center center / cover no-repeat fixed !important;

/* Optional: dark overlay so UI text stays readable */
  background-color: rgba(0,0,0,0.65) !important;
  background-blend-mode: overlay;
}

/* =========================
     MASTHEAD
     ========================= */

#container.ytd-masthead {
    background: linear-gradient(
      to bottom,
      #1f3b2d 0%,
      #13261c 100%
    ) !important;

box-shadow:
      inset 0 0 20px rgba(92,255,58,0.2),
      0 0 15px rgba(92,255,58,0.3);

border-bottom: 1px solid rgba(92,255,58,0.3);
  }

/* =========================
     SEARCH BAR
     ========================= */

#container.ytd-searchbox {
    background: var(--xbox-panel) !important;
    border-radius: 30px !important;

box-shadow:
      inset 0 0 10px rgba(92,255,58,0.2),
      0 0 10px rgba(92,255,58,0.15);

border: 1px solid rgba(92,255,58,0.3) !important;
  }

#search-icon-legacy {
    background: radial-gradient(circle, var(--xbox-glow) 0%, #2f6b1f 100%) !important;
    border-radius: 50% !important;
    box-shadow: 0 0 12px var(--xbox-glow);
  }

/* =========================
     VIDEO CARDS
     ========================= */

ytd-rich-item-renderer,
  ytd-video-renderer {
    background: var(--xbox-panel) !important;
    border-radius: 20px !important;

box-shadow:
      inset 0 0 20px rgba(92,255,58,0.1),
      0 0 15px rgba(92,255,58,0.15);

transition: all 0.25s ease;
  }

ytd-rich-item-renderer:hover,
  ytd-video-renderer:hover {
    box-shadow:
      inset 0 0 25px rgba(92,255,58,0.3),
      0 0 25px rgba(92,255,58,0.6);

transform: scale(1.02);
  }

/* =========================
     SIDEBAR
     ========================= */

#guide-content {
    background: linear-gradient(
      to bottom,
      #13261c,
      #0b140f
    ) !important;

box-shadow: inset 0 0 30px rgba(92,255,58,0.1);
  }

ytd-guide-entry-renderer {
    border-radius: 12px !important;
  }

ytd-guide-entry-renderer:hover {
    background: rgba(92,255,58,0.1) !important;
    box-shadow: 0 0 12px rgba(92,255,58,0.4);
  }

/* =========================
     PLAYER BORDER
     ========================= */

#ytd-player {
    border-radius: 25px !important;

box-shadow:
      0 0 30px rgba(92,255,58,0.4),
      inset 0 0 15px rgba(92,255,58,0.2);
  }

/* =========================
     PROGRESS BAR
     ========================= */

.ytp-play-progress {
    background: var(--xbox-glow) !important;
    box-shadow: 0 0 10px var(--xbox-glow);
  }

/* =========================
     GLOBAL TEXT
     ========================= */

* {
  font-family: 'Rajdhani', sans-serif !important;
  text-shadow: 0 0 6px rgba(92,255,58,0.4);
}

h1, h2, h3, #guide-content, #container.ytd-masthead {
  font-family: 'Orbitron', sans-serif !important;
  font-weight: 500 !important;
  letter-spacing: 1px;
}

/* =========================
   XBOX AMBIENT LIFE SYSTEM
   ========================= */

/* Background animated energy grid */

body::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: -1;

background:
    radial-gradient(circle at 30% 40%, rgba(92,255,58,0.15), transparent 40%),
    radial-gradient(circle at 70% 60%, rgba(92,255,58,0.1), transparent 50%),
    repeating-linear-gradient(
      0deg,
      rgba(92,255,58,0.05) 0px,
      rgba(92,255,58,0.05) 1px,
      transparent 1px,
      transparent 40px
    ),
    repeating-linear-gradient(
      90deg,
      rgba(92,255,58,0.05) 0px,
      rgba(92,255,58,0.05) 1px,
      transparent 1px,
      transparent 40px
    );

animation: xboxPulse 12s ease-in-out infinite alternate;
}

/* Slow atmospheric pulse */

@keyframes xboxPulse {
  0% {
    filter: brightness(1) saturate(1);
  }
  100% {
    filter: brightness(1.2) saturate(1.2);
  }
}

/* Floating particle shimmer */

ytd-app::after {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: -1;

background-image:
    radial-gradient(circle, rgba(92,255,58,0.4) 1px, transparent 2px);

background-size: 120px 120px;
  opacity: 0.2;

animation: xboxDrift 40s linear infinite;
}

@keyframes xboxDrift {
  from { transform: translateY(0px); }
  to   { transform: translateY(-200px); }
}

/* =========================
   GEL PANELS WITH DEPTH
   ========================= */

ytd-rich-item-renderer,
ytd-video-renderer,
#guide-content,
#container.ytd-searchbox {

backdrop-filter: blur(6px);
  background:
    linear-gradient(
      145deg,
      rgba(40,80,55,0.6),
      rgba(15,30,22,0.8)
    ) !important;

border: 1px solid rgba(92,255,58,0.25) !important;

box-shadow:
    inset 0 0 30px rgba(92,255,58,0.15),
    0 0 25px rgba(92,255,58,0.2),
    0 10px 30px rgba(0,0,0,0.6);
}

/* =========================
   HOVER ENERGY CHARGE
   ========================= */

ytd-rich-item-renderer:hover,
ytd-video-renderer:hover {

transform: scale(1.03) translateY(-3px);

box-shadow:
    inset 0 0 40px rgba(92,255,58,0.4),
    0 0 40px rgba(92,255,58,0.8),
    0 15px 40px rgba(0,0,0,0.8);

transition: all 0.25s ease;
}

/* =========================
   PLAYER ENERGY FRAME
   ========================= */

#ytd-player::before {
  content: "";
  position: absolute;
  inset: -8px;
  border-radius: 35px;
  pointer-events: none;

background: radial-gradient(circle, rgba(92,255,58,0.3), transparent 70%);
  filter: blur(20px);
  z-index: -1;
}

/* =========================
   SEARCH CORE GLOW
   ========================= */

#search-icon-legacy {
  animation: xboxCore 3s ease-in-out infinite alternate;
}

@keyframes xboxCore {
  0% {
    box-shadow: 0 0 10px #5cff3a;
  }
  100% {
    box-shadow: 0 0 25px #5cff3a;
  }
}

/* =========================
   SIDEBAR ACTIVE NODE
   ========================= */

ytd-guide-entry-renderer[active] {
  background: rgba(92,255,58,0.15) !important;
  box-shadow:
    inset 0 0 15px rgba(92,255,58,0.4),
    0 0 20px rgba(92,255,58,0.6);
}

}