← Back to Layouts
space rainbow cupcakes

Name: FriendRewind
Author: FriendRewind
Author: toxin
Category: Vintage
Created: June 26, 2026
Comments (1)

Cipao 07/29/2026 3:46 PM
This so cool!!!
You must log in to comment.
CSS Code

<style>
@import url('https://fonts.googleapis.com/css2?family=Creepster&family=Silkscreen:wght@400;700&display=swap');
  
:root {
  /* Neon rainbow + black */
  --color-black: #000000;
  --color-black-soft: #050505;
  --color-panel: rgba(0, 0, 0, 0.96);
  --color-panel-alt: rgba(8, 8, 8, 0.96);

  --color-purple-dark: #16001f;
  --color-purple: #b000ff;
  --color-purple-bright: #df00ff;
  --color-lilac: #ff72f6;

  --color-pastel-pink: #ff00aa;
  --color-pastel-pink-glow: rgba(255, 0, 170, 0.75);

  --color-cyan: #00f7ff;
  --color-blue: #0066ff;
  --color-green: #39ff14;
  --color-yellow: #fff200;
  --color-orange: #ff7a00;
  --color-red: #ff1744;

  --color-text: #ffffff;
  --color-text-muted: #c9c9c9;
  --color-white: #ffffff;
  --color-transparent: transparent;

  --color-shadow: rgba(0, 0, 0, 0.95);
  --color-purple-glow: rgba(223, 0, 255, 0.70);
  --color-cyan-glow: rgba(0, 247, 255, 0.70);
  --color-green-glow: rgba(57, 255, 20, 0.55);

  --color-scroll-track: #020202;
  --color-scroll-thumb: #ff00aa;
  --color-scroll-thumb-hover: #00f7ff;
  --color-border-brown: #ff00aa;

  --rainbow-gradient: linear-gradient(
    90deg,
    #ff1744 0%,
    #ff7a00 16%,
    #fff200 32%,
    #39ff14 48%,
    #00f7ff 64%,
    #0066ff 80%,
    #df00ff 100%
  );

  --rainbow-gradient-loop: linear-gradient(
    90deg,
    #ff1744,
    #ff7a00,
    #fff200,
    #39ff14,
    #00f7ff,
    #0066ff,
    #df00ff,
    #ff1744
  );

  --rainbow-glow:
    0 0 5px #ff00aa,
    0 0 10px #df00ff,
    0 0 18px rgba(0, 247, 255, 0.75),
    0 0 28px rgba(57, 255, 20, 0.38);
}

/* Keep the browser window still. Only the profile box scrolls. */
html,
body {
    margin: 0 !important;
    min-height: 100% !important;
}

* {
    box-sizing: border-box !important;
}

body,
body * {
    color: var(--color-text) !important;
  font-family: "Silkscreen", sans-serif !important;
    cursor: url('https://64.media.tumblr.com/a1880eccac3497a4c1c273bcc9176c15/b6153098e27d7aa4-65/s75x75_c1/1db69308e32c4d8a80d346b2989a536506259998.pnj'), auto !important;
}

a,
button,
input,
textarea,
select {
    cursor: url('https://64.media.tumblr.com/a1880eccac3497a4c1c273bcc9176c15/b6153098e27d7aa4-65/s75x75_c1/1db69308e32c4d8a80d346b2989a536506259998.pnj'), pointer !important;
}

body {
    display: flex !important;
    align-items: flex-start !important;
  justify-content: center !important;
    padding: 20px 0 !important;
    background-color: var(--color-black) !important;
    background-image: url('https://dl.glitter-graphics.com/pub/3549/3549422n9rbw1e2di.gif') !important;
    background-repeat: repeat !important;
    font-size: 12px !important;
    line-height: 1.25 !important;
}


/* Main 800 x 800 scrolling profile window */
.master-container {
    position: relative !important;
    isolation: isolate !important;
  
      top: 20px !important;

    min-width: 800px !important;
    max-width: 800px !important;
    height: 800px !important;
    max-height: 800px !important;
    margin: 0 !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    background-color: var(--color-panel) !important;
    border: 1px solid var(--color-pastel-pink) !important;
    box-shadow:
        0 0 10px var(--color-pastel-pink-glow),
        0 0 24px var(--color-pastel-pink-glow) !important;
    scrollbar-color: var(--color-scroll-thumb) var(--color-scroll-track) !important;
    scrollbar-width: thin !important;
}

/*
This sticky layer stays pinned to the visible 800 x 800 box while the
profile content scrolls above it.
*/
.master-container::before {
    content: '' !important;
    position: sticky !important;
    top: 0 !important;
    left: 0 !important;
    display: block !important;
    width: 100% !important;
    height: 800px !important;
    margin-bottom: -800px !important;
    background-color: var(--color-panel) !important;
/*    background-image: url('https://i2.glitter-graphics.org/pub/1062/1062242ekzerptard.gif') !important; */
    background-repeat: repeat !important;
    background-position: top left !important;
    pointer-events: none !important;
    z-index: -1 !important;
}

.master-container::-webkit-scrollbar {
    width: 12px !important;
}

.master-container::-webkit-scrollbar-track {
    background: var(--color-scroll-track) !important;
    border-left: 1px solid var(--color-pastel-pink) !important;
}

.master-container::-webkit-scrollbar-thumb {
    background-color: var(--color-scroll-thumb) !important;
    border: 1px solid var(--color-pastel-pink) !important;
}

.master-container::-webkit-scrollbar-thumb:hover {
    background-color: var(--color-scroll-thumb-hover) !important;
}

/* Compact overall spacing */
main,
.profile,
.profile-body,
.profile-content,
.left-column,
.right-column {
    gap: 8px !important;
}

main,
.profile,
.profile-body,
.profile-content {
    margin: 0 !important;
    padding: 0 !important;
}

.left-column,
.right-column {
    margin: 0 !important;
    padding: 0 !important;
}

/* Compact modules */
.contact,
.url-info,
.table-section,
.tunes,
.blog-preview,
.blurbs,
.friends,
.photos-preview,
#comments,
.profile-playlist-widget {
    margin: 0 0 8px 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    background: var(--color-panel-alt) !important;
    border: 1px solid var(--color-pastel-pink) !important;
    box-shadow: 0 0 8px var(--color-pastel-pink-glow) !important;
}

/* Small tiled headers */
.contact .heading,
.url-info .heading,
.table-section .heading,
.tunes .heading,
.blog-preview h4,
.blurbs .heading,
.friends .heading,
.photos-preview .heading,
#comments .heading,
.heading h4,
.pp-header {
    min-height: 25px !important;
    height: 25px !important;
    margin: 0 !important;
    padding: 0 7px !important;
    background-color: #09000f !important;
    background-image: url('https://i5.glitter-graphics.org/pub/906/906855cpqs5tc2hv.gif') !important;
    background-position: top left !important;
    background-repeat: repeat !important;
    border: 0 !important;
    border-bottom: 1px solid var(--color-pastel-pink) !important;
    color: var(--color-white) !important;
    font-family: "Creepster", cursive !important;
    font-size: 17px !important;
    font-weight: normal !important;
    line-height: 23px !important;
    letter-spacing: 0.5px !important;
    text-align: left !important;
    text-shadow:
        1px 1px 0 var(--color-black),
        0 0 4px var(--color-black) !important;
}

/* Tight content padding */
.contact .inner,
.url-info .inner,
.table-section .inner,
.tunes .inner,
.blog-preview .inner,
.blurbs .inner,
.friends .inner,
.photos-preview .inner,
#comments .inner,
.profile-playlist-widget ul {
    padding: 6px !important;
    margin: 0 !important;
}

p,
ul,
ol,
blockquote {
    margin-top: 4px !important;
    margin-bottom: 4px !important;
}

ul,
ol {
    padding-left: 18px !important;
}

h1 {
    margin: 2px 0 5px !important;
    color: var(--color-lilac) !important;
    font-family: "Creepster", cursive !important;
    font-size: 25px !important;
    line-height: 1.05 !important;
    letter-spacing: 1px !important;
    text-shadow:
        2px 2px 0 var(--color-black),
        0 0 8px var(--color-purple-bright) !important;
}

h2,
h3,
h4,
h5,
h6 {
    margin: 4px 0 !important;
    color: var(--color-lilac) !important;
    font-family: "Creepster", cursive !important;
}

/* Links */
a {
    color: var(--color-purple-bright) !important;
    font-weight: bold !important;
    text-decoration: none !important;
}

a:hover {
    color: var(--color-white) !important;
    text-shadow: 0 0 5px var(--color-purple-bright) !important;
}

/* Header and navigation */
.main-header,
.myspace-header,
.top-nav,
.main-nav-wrapper,
.main-nav-container,
.main-nav,
.main-nav li {
    margin: 0 !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    background: var(--color-transparent) !important;
    border: 0 !important;
    box-shadow: none !important;
}

#site-logo-link {
    padding: 0 0 4px !important;
}

#logo {
    max-height: 55px !important;
    width: auto !important;
}

.main-nav {
    min-height: 25px !important;
    margin-bottom: 7px !important;
    background-color: #09000f !important;
    background-image: url('https://i1.glitter-graphics.org/pub/2272/2272791vq4dmyigzw.gif') !important;
    border: 1px solid var(--color-pastel-pink) !important;
    box-shadow: 0 0 8px var(--color-pastel-pink-glow) !important;
}

.main-nav a,
.nav a,
.main-nav .dropdown > a {
    display: inline-block !important;
    padding: 4px 7px !important;
    color: var(--color-white) !important;
    font-size: 11px !important;
    line-height: 16px !important;
    text-shadow: 1px 1px 0 var(--color-black) !important;
}

.main-nav a:hover {
    background: var(--color-black-soft) !important;
    color: var(--color-lilac) !important;
}

/* Main profile picture: always square */
.profile-pic {
    width: 100% !important;
    max-width: 180px !important;
    aspect-ratio: 1 / 1 !important;
    overflow: hidden !important;
}

.profile-pic img {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    aspect-ratio: 1 / 1 !important;
    object-fit: cover !important;
    object-position: center !important;
}

/* Profile and friend image borders */
.person img,
.profile-pic img,
.friends-grid img,
img.cb-pfp-img,
.person img.pfp-fallback {
    border: 1px solid var(--color-pastel-pink) !important;
    box-shadow: 0 0 7px var(--color-pastel-pink-glow) !important;
    background: var(--color-black) !important;
}

.friends-grid {
    gap: 5px !important;
}

.friends-grid .person {
    margin: 0 !important;
    padding: 2px !important;
}

/* Tables */
.details-table,
.comments-table {
    width: 100% !important;
    margin: 0 !important;
    border-collapse: collapse !important;
    background: var(--color-black-soft) !important;
    border: 1px solid  var(--color-pastel-pink) !important;
}

.details-table th,
.details-table td,
.comments-table th,
.comments-table td {
    padding: 3px 5px !important;
    border: 1px solid var(--color-pastel-pink) !important;
    font-size: 11px !important;
    line-height: 1.2 !important;
}

.details-table th {
    width: 30% !important;
    background: var(--color-purple-dark) !important;
    color: var(--color-lilac) !important;
    font-family: "Creepster", cursive !important;
    font-size: 14px !important;
}

.cb-author-cell {
    width: 120px !important;
    background: var(--color-purple-dark) !important;
    border-right: 1px solid var(--color-pastel-pink) !important;
}

.cb-content-cell {
    background: var(--color-black-soft) !important;
}

/* Buttons and form controls */
button,
input,
textarea,
select,
.cb-actions a,
.cb-reply-form input[type='submit'],
.pp-help-btn,
.bar-btn {
    padding: 3px 6px !important;
    background: var(--color-black-soft) !important;
    border: 1px solid  var(--color-pastel-pink) !important;
    color: var(--color-lilac) !important;
    font-size: 11px !important;
}

button:hover,
input[type='submit']:hover,
.cb-actions a:hover,
.pp-help-btn:hover,
.bar-btn:hover {
    background: var(--color-purple-dark) !important;
    color: var(--color-white) !important;
    box-shadow: 0 0 6px var(--color-purple-glow) !important;
}

/* Playlist */
.profile-playlist-widget {
    background: var(--color-panel-alt) !important;
}

.pp-header h3 {
    margin: 0 !important;
    color: var(--color-white) !important;
    font-family: "Creepster", cursive !important;
    font-size: 17px !important;
    line-height: 23px !important;
}

.profile-playlist-widget ul {
    border: 0 !important;
    background: var(--color-transparent) !important;
}

/* Bottom music bar kept compact */
#footer-music-bar,
.music-bar {
    min-height: 38px !important;
    background: var(--color-black-soft) !important;
    border-top: 1px solid  var(--color-pastel-pink) !important;
    box-shadow: 0 -3px 10px var(--color-purple-glow) !important;
}

#bar-title {
    color: var(--color-lilac) !important;
    font-family: "Creepster", cursive !important;
    font-size: 14px !important;
    text-shadow: 1px 1px 0 var(--color-black) !important;
}

.bar-progress-container,
.bar-playlist-container,
.bar-volume {
    background: var(--color-black) !important;
    border: 1px solid var(--color-pastel-pink) !important;
}

.bar-btn svg {
    fill: var(--color-lilac) !important;
}

.bar-btn:hover svg {
    fill: var(--color-white) !important;
}

/* Footer */
footer[role='contentinfo'] {
    margin: 8px 0 0 !important;
    padding: 7px !important;
    background: var(--color-black-soft) !important;
    border: 1px solid var(--color-pastel-pink) !important;
    box-shadow: 0 0 8px var(--color-pastel-pink-glow) !important;
    font-size: 10px !important;
    text-align: center !important;
}

footer nav ul.links {
    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: center !important;
    gap: 5px 10px !important;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
}

footer p.copyright {
    margin: 3px 0 0 !important;
    font-size: 10px !important;
}

/* Prevent wide media from breaking the 800px frame */
img,
video,
iframe,
table {
    max-width: 100% !important;
}

/* Hide decorative fixed overlays from the old theme */
.skull-rain,
body::after,
.mood::after,
.profile-mood::after,
.profile .mood::after,
.photos-preview::after,
.blog-preview::after,
.blurbs::after,
.friends::after {
    display: none !important;
    content: none !important;
}
  
  

/* Apple overlay pinned over the bottom-right of the master container */
.master-container::after {
    content: '' !important;
    position: sticky !important;
    bottom: 0 !important;
    display: block !important;
    width: 220px !important;
    height: 220px !important;
    margin-top: -220px !important;
    margin-left: auto !important;
    margin-right: -10px !important;
    background-image: url('https://64.media.tumblr.com/9f6b8b6b38f05cad0e79e49c4c1a9b6b/tumblr_ohr1jsJKuD1vkpk4fo5_100.pnj') !important;
    background-repeat: no-repeat !important;
    background-position: bottom right !important;
    background-size: contain !important;
    pointer-events: none !important;
    z-index: 9999 !important;
}

/* Decorative divider beneath every section box */
.contact::after,
.url-info::after,
.table-section::after,
.tunes::after,
.blog-preview::after,
.blurbs::after,
.friends::after,
.photos-preview::after,
#comments::after,
.profile-playlist-widget::after {
    content: '' !important;
    display: block !important;
    width: 100% !important;
    height: 30px !important;
    background-image: url('https://64.media.tumblr.com/77c4dc4f916a2092d11ca5359a62e534/7a839d38b7e10039-1a/s500x750/694d7d7b4ad1b4abcd4cfcefce31ae71fbe859eb.gifv') !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    background-size: contain !important;
    pointer-events: none !important;
}

  .online img {
  height: 1.5em !important;
  width: auto !important;
  margin-right: 5px !important;
  content: url('https://i5.glitter-graphics.org/pub/745/745455rvacxjsot2.gif') !important;
  animation: none !important;
}
  
  .myspace-header .nav-logo {
  content: url('https://64.media.tumblr.com/820708db02afd3370a06f765726e1c13/bea578ccfee15413-af/s100x200/2c12b7978fc1f095e40e5a45b4b112c5c4c587d6.gifv') !important;
  height: 45px !important;
  width: auto !important;
  margin: 0 10px !important;
  position: relative !important;
  top: 2px !important;
}
  
  
.profile-name-text {
  display: inline-block !important;
  font-family: "Creepster", cursive !important;
  font-size: 50px !important;
  line-height: 1 !important;
  letter-spacing: 2px !important;

  background-image: linear-gradient(
    90deg,
    #ff1493,
    #ff4d00,
    #ffe600,
    #39ff14,
    #00eaff,
    #4967ff,
    #c400ff,
    #ff1493
  ) !important;
  background-size: 300% 100% !important;
  background-position: 0% 50% !important;
  background-clip: text !important;
  -webkit-background-clip: text !important;
  color: transparent !important;
  -webkit-text-fill-color: transparent !important;

  text-shadow: none !important;
  animation:
    profileNameBounce 1.15s ease-in-out infinite,
    profileNameRainbow 4s linear infinite !important;
  transform-origin: center bottom !important;
}

@keyframes profileNameBounce {
  0%, 100% {
    transform: translateY(0);
  }

  45% {
    transform: translateY(-10px);
  }

  65% {
    transform: translateY(-4px);
  }
}

@keyframes profileNameRainbow {
  0% {
    background-position: 0% 50%;
  }

  100% {
    background-position: 300% 50%;
  }
}
  
  .profile-mood::after {
  content: "" !important;
  display: block !important;
  width: 100% !important;
  height: 28px !important;
  margin-top: 6px !important;
  background-image: url('https://gloomy-poison.neocities.org/scene_graphics/scene001.png') !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: contain !important;
}
  .music-bar::before {
  content: none !important;
  background: none !important;
  display: none !important;
}
  
  
  #footer-music-bar,
.music-bar {
  background-color: var(--color-panel) !important;
  background-image: url('https://dl.glitter-graphics.com/pub/3765/3765823a236nmb02p.gif') !important;
  background-repeat: repeat !important;
  background-position: top left !important;
  background-size: auto !important;
}
  
 .icon {
  content: url('https://64.media.tumblr.com/2552b7157534dbc5245cdcbdfb26e4f0/2051ae6934666ac4-f7/s75x75_c1/06e7f295802df0169382bb3f491fc031714cd2c1.gifv') !important;
  width: auto !important;
  height: 1.5em !important;
}
  
.pf-photo-grid img,
.person img,
.cb-author-link img,
.badge-icon {
  filter:
    grayscale(100%)
    brightness(65%)
    sepia(100%)
    saturate(1100%)
    hue-rotate(245deg)
    contrast(140%)
    drop-shadow(0 0 4px #b000ff)
    drop-shadow(0 0 10px #7a00ff) !important;
}

.pf-photo-grid img:hover,
.person img:hover,
.cb-author-link img:hover,
.badge-icon:hover {
  filter:
    grayscale(40%)
    brightness(105%)
    sepia(60%)
    saturate(500%)
    hue-rotate(245deg)
    contrast(120%)
    drop-shadow(0 0 5px #d966ff)
    drop-shadow(0 0 10px #7a00ff) !important;
}

  
  /* Playlist outer box */
.profile-playlist-widget {
  background: #020202 !important;
  border: 2px solid transparent !important;
  border-radius: 6px !important;
  box-shadow:
    0 0 6px rgba(255, 0, 0, 0.65),
    0 0 14px rgba(255, 0, 0, 0.35) !important;
  overflow: hidden !important;
}

/* Playlist header */
.pp-header {
  background: #09000f !important;
  border-bottom: 2px solid transparent !important;
  color: #ffffff !important;
}

.pp-header h3 {
  color: #ff72f6 !important;
  text-shadow:
    0 0 4px #ff0000,
    0 0 8px #ff0000 !important;
}

/* Song list */
.profile-playlist-widget ul {
  margin: 0 !important;
  padding: 6px !important;
  background: #000000 !important;
  border: 0 !important;
}

/* Each song row */
.profile-playlist-item {
  display: flex !important;
  align-items: center !important;
  gap: 7px !important;
  margin-bottom: 5px !important;
  padding: 6px 8px !important;
  background: #070707 !important;
  border: 1px solid #8a00ff !important;
  border-radius: 4px !important;
  color: #f5f5f5 !important;
}

.profile-playlist-item:last-child {
  margin-bottom: 0 !important;
}

.profile-playlist-item:hover {
  background: #100018 !important;
  border-color: #39ff14 !important;
  box-shadow: 0 0 7px rgba(255, 0, 0, 0.6) !important;
}

/* Currently playing song */
.profile-playlist-item.current {
  background: #07151a !important;
  border-color: #ff72f6 !important;
  box-shadow:
    inset 0 0 8px rgba(255, 0, 0, 0.3),
    0 0 8px rgba(255, 0, 0, 0.6) !important;
}

/* Song title and artist */
.song-info {
  flex: 1 !important;
  color: #ffffff !important;
}

.song-artist {
  color: #00f7ff !important;
  font-size: 0.9em !important;
}

/* Drag handle */
.pp-drag {
  color: #ff72f6 !important;
  cursor: grab !important;
}

/* Equalizer */
.pp-equalizer {
  color: #39ff14 !important;
}

/* Remove button */
.pp-remove {
  background: #000000 !important;
  color: #ff72f6 !important;
  border: 2px solid transparent !important;
  border-radius: 4px !important;
}

.pp-remove:hover {
  background: var(--color-purple-dark) !important;
  color: #ffffff !important;
}

/* Help panel */
.pp-help-panel {
  background: #080808 !important;
  color: #dddddd !important;
  border-bottom: 1px solid #00f7ff !important;
}
  
  .profile-playlist-widget,
.profile-playlist-item,
.pp-remove {
  border-radius: 0 !important;
}
  
  footer .links {
  background: var(--color-black-soft) !important;
}
  
  .bar-playlist-btn {
  position: relative !important;
}

.bar-playlist-btn::after {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  background-image: url('https://64.media.tumblr.com/3e99fec09b177fd7ae99095ef3e8ce58/a21613f2eb57a647-49/s75x75_c1/65ddd00ac471c961e865d2af5da7b96cfbf4d8ec.gifv') !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: contain !important;
  pointer-events: none !important;
  z-index: 2 !important;
}

/* =========================================================
   RAINBOW BORDERS + PURPLE / BLUE / PINK GLOW
   ========================================================= */

.master-container {
  border: 3px solid transparent !important;
  border-image: var(--rainbow-gradient-loop) 1 !important;
  box-shadow:
    0 0 6px #ff1493,
    0 0 13px rgba(255, 20, 147, 0.82),
    0 0 21px rgba(183, 0, 255, 0.76),
    0 0 31px rgba(0, 89, 255, 0.66) !important;
}

.contact,
.url-info,
.table-section,
.tunes,
.blog-preview,
.blurbs,
.friends,
.photos-preview,
#comments,
.profile-playlist-widget,
footer[role='contentinfo'] {
  border: 2px solid transparent !important;
  border-image: var(--rainbow-gradient-loop) 1 !important;
  box-shadow:
    0 0 4px #ff1493,
    0 0 9px rgba(183, 0, 255, 0.72),
    0 0 14px rgba(0, 89, 255, 0.56) !important;
}

.contact .heading,
.url-info .heading,
.table-section .heading,
.tunes .heading,
.blog-preview h4,
.blurbs .heading,
.friends .heading,
.photos-preview .heading,
#comments .heading,
.heading h4,
.pp-header {
  border-bottom: 2px solid transparent !important;
  border-image: var(--rainbow-gradient-loop) 1 !important;
  box-shadow:
    0 3px 5px rgba(255, 20, 147, 0.55),
    0 5px 9px rgba(117, 0, 255, 0.42),
    0 7px 12px rgba(0, 89, 255, 0.28) !important;
  text-shadow: none !important;
}

.main-nav {
  border: 2px solid transparent !important;
  border-image: var(--rainbow-gradient-loop) 1 !important;
  box-shadow:
    0 0 5px #ff1493,
    0 0 10px rgba(183, 0, 255, 0.7),
    0 0 15px rgba(0, 89, 255, 0.5) !important;
}

.person img,
.profile-pic img,
.friends-grid img,
img.cb-pfp-img,
.person img.pfp-fallback,
.pf-photo-grid img,
.cb-author-link img,
.badge-icon {
  border: 2px solid transparent !important;
  border-image: var(--rainbow-gradient-loop) 1 !important;
  box-shadow:
    0 0 4px #ff1493,
    0 0 8px rgba(183, 0, 255, 0.65),
    0 0 12px rgba(0, 89, 255, 0.42) !important;
}

.details-table,
.comments-table {
  border: 2px solid transparent !important;
  border-image: var(--rainbow-gradient-loop) 1 !important;
  box-shadow:
    0 0 4px #ff1493,
    0 0 8px rgba(117, 0, 255, 0.58),
    0 0 12px rgba(0, 89, 255, 0.35) !important;
}

button,
input,
textarea,
select,
.cb-actions a,
.cb-reply-form input[type='submit'],
.pp-help-btn,
.bar-btn,
.pp-remove {
  border: 2px solid transparent !important;
  border-image: var(--rainbow-gradient-loop) 1 !important;
  box-shadow:
    0 0 4px rgba(255, 20, 147, 0.78),
    0 0 8px rgba(117, 0, 255, 0.52),
    0 0 11px rgba(0, 89, 255, 0.32) !important;
}

button:hover,
input[type='submit']:hover,
.cb-actions a:hover,
.pp-help-btn:hover,
.bar-btn:hover,
.pp-remove:hover {
  box-shadow:
    0 0 6px #ff1493,
    0 0 11px rgba(183, 0, 255, 0.76),
    0 0 16px rgba(0, 89, 255, 0.58) !important;
}

.profile-playlist-item {
  border: 1px solid transparent !important;
  border-image: var(--rainbow-gradient-loop) 1 !important;
}

.profile-playlist-item:hover,
.profile-playlist-item.current {
  border: 2px solid transparent !important;
  border-image: var(--rainbow-gradient-loop) 1 !important;
  box-shadow:
    0 0 5px #ff1493,
    0 0 9px rgba(183, 0, 255, 0.68),
    0 0 13px rgba(0, 89, 255, 0.45) !important;
}

#footer-music-bar,
.music-bar {
  border-top: 3px solid transparent !important;
  border-image: var(--rainbow-gradient-loop) 1 !important;
  box-shadow:
    0 -3px 7px #ff1493,
    0 -5px 12px rgba(183, 0, 255, 0.58),
    0 -7px 16px rgba(0, 89, 255, 0.38) !important;
}

.bar-progress-container,
.bar-playlist-container,
.bar-volume {
  border: 2px solid transparent !important;
  border-image: var(--rainbow-gradient-loop) 1 !important;
}

.bar-playlist-btn::after {
  filter: none !important;
}
</style>