@keyframes rain-fall-a { from { transform: translate3d(0, 0, 0); } to { transform: translate3d(0, 600px, 0); } }
@keyframes rain-fall-b { from { transform: translate3d(0, 0, 0); } to { transform: translate3d(0, 690px, 0); } }
@keyframes rain-flicker { 0%, 100% { opacity: 0.9; } 46% { opacity: 0.9; } 48% { opacity: 0.45; } 50% { opacity: 1; } 52% { opacity: 0.6; } 54% { opacity: 0.95; } }
@keyframes rain-name { 0%, 100% { text-shadow: 0 0 6px #00ff9c, 0 0 18px #00ff9c, 0 0 2px #ffffff; } 50% { text-shadow: 0 0 10px #ff2bd6, 0 0 26px #ff2bd6, 0 0 2px #ffffff; } }
#profile::before { content: ""; position: absolute; inset: 0; z-index: -3; background: radial-gradient(ellipse at 18% 0%, rgba(255, 0, 170, 0.3), rgba(0, 0, 0, 0) 55%), radial-gradient(ellipse at 85% 100%, rgba(0, 255, 156, 0.22), rgba(0, 0, 0, 0) 60%), linear-gradient(180deg, #03020a, #060b14 60%, #020407); }
#profile::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, rgba(3, 2, 10, 0), rgba(3, 2, 10, 0.5) 20%, rgba(3, 2, 10, 0.5) 80%, rgba(3, 2, 10, 0)); }
#profile .profile-inner::before, #profile .profile-inner::after { content: ""; position: absolute; z-index: -2; backface-visibility: hidden; }
#profile .profile-inner::before { left: 0; right: 0; top: -600px; bottom: 0; background: repeating-linear-gradient(180deg, rgba(0, 255, 156, 0) 0 30px, rgba(0, 255, 156, 0.8) 88px, #eafff4 88px 91px, rgba(0, 0, 0, 0) 91px 150px); -webkit-mask-image: repeating-linear-gradient(90deg, #000000 0 2px, rgba(0, 0, 0, 0) 2px 34px); mask-image: repeating-linear-gradient(90deg, #000000 0 2px, rgba(0, 0, 0, 0) 2px 34px); animation: rain-fall-a 6s linear infinite, rain-flicker 5s steps(1) infinite; }
#profile .profile-inner::after { left: 0; right: 0; top: -690px; bottom: 0; background: repeating-linear-gradient(180deg, rgba(255, 43, 214, 0) 0 50px, rgba(255, 43, 214, 0.65) 128px, #ffe6fb 128px 131px, rgba(0, 0, 0, 0) 131px 230px); -webkit-mask-image: repeating-linear-gradient(90deg, rgba(0, 0, 0, 0) 0 17px, #000000 17px 19px, rgba(0, 0, 0, 0) 19px 51px); mask-image: repeating-linear-gradient(90deg, rgba(0, 0, 0, 0) 0 17px, #000000 17px 19px, rgba(0, 0, 0, 0) 19px 51px); animation: rain-fall-b 9s linear infinite, rain-flicker 7s steps(1) -3s infinite; }
#profile .profile-inner { gap: 18px; max-width: 980px; }
#profile { background: transparent; color: #dcffee; }
#profile a { color: #00ff9c; }
#profile a:hover { color: #ff7ae4; }
#profile .profile-name, #profile .profile-facts, #profile .headline, #profile .last-login, #profile .mood, #profile .view-my { color: #dcffee; text-shadow: 0 1px 4px #000000; }
#profile .last-login, #profile .comment-date, #profile .comment-count, #profile .friend-count, #profile .comment-note, #profile .view-all { color: #8fd6b6; }
#profile .interests, #profile .details, #profile .extended-network, #profile .friends-block, #profile .blurbs, #profile .profile-mail, #profile .friend-space, #profile .comments, #profile .games, #profile .music-player, #profile .profile-panel { background: rgba(4, 10, 14, 0.62); border: 1px solid rgba(0, 255, 156, 0.45); border-radius: 8px; padding: 8px; color: #dcffee; }
#profile .interests, #profile .details { border-collapse: separate; border-spacing: 0; border-color: rgba(0, 255, 156, 0.45); border-radius: 8px; overflow: hidden; }
#profile .interests th, #profile .details th { background: rgba(255, 43, 214, 0.22); color: #ffe6fb; }
#profile .interests .label, #profile .details .label { background: rgba(4, 10, 14, 0.6); color: #00ff9c; }
#profile .section-title { background: rgba(255, 43, 214, 0.22); color: #ffe6fb; border-radius: 4px; }
#profile .blurbs h3, #profile .game-box h3, #profile .song-title { color: #00ff9c; }
#profile .extended-network { color: #00ff9c; }
#profile .comment-author, #profile .comment-body { background: rgba(8, 18, 22, 0.64); color: #dcffee; border-radius: 4px; }
#profile .comment-form label { color: #dcffee; }
#profile .comment-form textarea { background: rgba(2, 6, 8, 0.9); border-color: rgba(0, 255, 156, 0.45); color: #dcffee; }
#profile .music-start { background: rgba(8, 18, 22, 0.64); border-color: rgba(0, 255, 156, 0.45); color: #dcffee; }
#profile .music-start:hover { background: rgba(4, 10, 14, 0.6); }
#profile .music-hint, #profile .music-link { color: #8fd6b6; }
#profile .deck-screen, #profile .deck-button, #profile .deck-video, #profile .deck-num { color: #00ff9c; }
#profile .deck-shell { border-color: rgba(0, 255, 156, 0.45); }
#profile .online-now { background: rgba(8, 18, 22, 0.64); color: #dcffee; }
#profile .interests, #profile .details, #profile .extended-network, #profile .friends-block, #profile .blurbs, #profile .profile-mail, #profile .friend-space, #profile .comments, #profile .games, #profile .music-player, #profile .profile-panel { border-radius: 6px; box-shadow: 0 0 0 1px rgba(255, 43, 214, 0.25), 0 0 22px rgba(0, 255, 156, 0.18), inset 0 1px 0 rgba(255, 255, 255, 0.1); -webkit-backdrop-filter: blur(12px) saturate(150%); backdrop-filter: blur(12px) saturate(150%); }
#profile .interests, #profile .details { -webkit-backdrop-filter: blur(12px) saturate(150%); backdrop-filter: blur(12px) saturate(150%); }
#profile .section-title { border-left: 3px solid #00ff9c; font-family: "Courier New", Courier, monospace; letter-spacing: 2px; text-transform: uppercase; }
#profile .profile-name { color: #eafff4; font-family: "Courier New", Courier, monospace; letter-spacing: 3px; animation: rain-name 6s ease-in-out infinite; }
#profile .profile-pic { border: 1px solid #00ff9c; border-radius: 4px; box-shadow: 0 0 16px rgba(0, 255, 156, 0.55), 4px 4px 0 rgba(255, 43, 214, 0.45); }