/* ====================================
   PARALLEL ALPHA THEME
   Cyan/Teal cyberpunk aesthetic with neon borders
   ==================================== */

body.parallel-alpha {
    background: linear-gradient(135deg, #0a192f 0%, #112240 50%, #1a2332 100%);
    font-family: 'Courier New', 'Consolas', monospace;
    position: relative;
}

body.parallel-alpha::before {
    content: '';
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    z-index: 0;
    background-image: 
        /* Plasma blobs with weird shapes */
        radial-gradient(ellipse 200px 100px at 20% 30%, rgba(147, 51, 234, 0.3), transparent),
        radial-gradient(circle 150px at 80% 20%, rgba(255, 107, 157, 0.2), transparent),
        radial-gradient(ellipse 180px 250px at 60% 70%, rgba(78, 205, 196, 0.25), transparent),
        radial-gradient(ellipse 120px 200px at 10% 80%, rgba(255, 217, 61, 0.2), transparent),
        radial-gradient(circle 100px at 90% 60%, rgba(147, 51, 234, 0.25), transparent),
        radial-gradient(ellipse 160px 80px at 40% 10%, rgba(255, 107, 157, 0.15), transparent),
        radial-gradient(ellipse 140px 300px at 75% 85%, rgba(78, 205, 196, 0.2), transparent);
    animation: plasma-morph 15s ease-in-out infinite;
}

body.parallel-alpha::after {
    content: '';
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    z-index: 0;
    background-image:
        /* Triangles */
        conic-gradient(from 45deg at 30% 40%, transparent 0deg, rgba(147, 51, 234, 0.15) 120deg, transparent 240deg),
        conic-gradient(from 120deg at 70% 60%, transparent 0deg, rgba(255, 107, 157, 0.1) 90deg, transparent 180deg),
        /* Squares/Diamonds */
        conic-gradient(from 0deg at 50% 20%, transparent 0deg, rgba(78, 205, 196, 0.12) 90deg, transparent 180deg, rgba(78, 205, 196, 0.12) 270deg, transparent 360deg),
        conic-gradient(from 45deg at 20% 50%, transparent 0deg, rgba(255, 217, 61, 0.1) 90deg, transparent 180deg, rgba(255, 217, 61, 0.1) 270deg, transparent 360deg),
        /* Pentagons (5 sides) */
        conic-gradient(from 0deg at 15% 70%, transparent 0deg, rgba(147, 51, 234, 0.12) 72deg, transparent 144deg, rgba(147, 51, 234, 0.12) 216deg, transparent 288deg),
        conic-gradient(from 90deg at 85% 25%, transparent 0deg, rgba(255, 107, 157, 0.08) 72deg, transparent 144deg, rgba(255, 107, 157, 0.08) 216deg, transparent 288deg),
        /* Hexagons (6 sides) */
        conic-gradient(from 30deg at 60% 80%, transparent 0deg, rgba(78, 205, 196, 0.1) 60deg, transparent 120deg, rgba(78, 205, 196, 0.1) 180deg, transparent 240deg, rgba(78, 205, 196, 0.1) 300deg, transparent 360deg),
        /* Octagons (8 sides) */
        conic-gradient(from 22.5deg at 80% 75%, transparent 0deg, rgba(255, 217, 61, 0.09) 45deg, transparent 90deg, rgba(255, 217, 61, 0.09) 135deg, transparent 180deg, rgba(255, 217, 61, 0.09) 225deg, transparent 270deg, rgba(255, 217, 61, 0.09) 315deg, transparent 360deg);
    animation: plasma-shapes-float 20s linear infinite;
}

@keyframes plasma-morph {
    0%, 100% {
        transform: scale(1) rotate(0deg);
        opacity: 1;
    }
    25% {
        transform: scale(1.1) rotate(5deg);
        opacity: 0.8;
    }
    50% {
        transform: scale(0.95) rotate(-3deg);
        opacity: 1;
    }
    75% {
        transform: scale(1.05) rotate(7deg);
        opacity: 0.9;
    }
}

@keyframes plasma-shapes-float {
    0% {
        transform: translateY(0) translateX(0) rotate(0deg);
    }
    25% {
        transform: translateY(-30px) translateX(20px) rotate(90deg);
    }
    50% {
        transform: translateY(-10px) translateX(-15px) rotate(180deg);
    }
    75% {
        transform: translateY(-40px) translateX(10px) rotate(270deg);
    }
    100% {
        transform: translateY(0) translateX(0) rotate(360deg);
    }
}

body.parallel-alpha .content-container {
    background: radial-gradient(circle at center, rgba(78, 205, 196, 0.05) 0%, transparent 70%);
    position: relative;
}

/* Dancing balls and additional shapes layer */
body.parallel-alpha .content-container::before {
    content: '';
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    z-index: 0;
    background-image:
        /* Dancing balls */
        radial-gradient(circle 15px at 25% 35%, rgba(147, 51, 234, 0.4), transparent),
        radial-gradient(circle 20px at 75% 45%, rgba(255, 107, 157, 0.3), transparent),
        radial-gradient(circle 12px at 45% 65%, rgba(78, 205, 196, 0.35), transparent),
        radial-gradient(circle 18px at 65% 25%, rgba(255, 217, 61, 0.3), transparent),
        radial-gradient(circle 10px at 15% 55%, rgba(147, 51, 234, 0.4), transparent),
        radial-gradient(circle 16px at 85% 70%, rgba(255, 107, 157, 0.35), transparent),
        radial-gradient(circle 14px at 55% 15%, rgba(78, 205, 196, 0.3), transparent),
        radial-gradient(circle 22px at 35% 85%, rgba(255, 217, 61, 0.35), transparent);
    animation: balls-dance 8s ease-in-out infinite;
}

/* Additional rotating shapes layer */
body.parallel-alpha .content-container::after {
    content: '';
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    z-index: 0;
    background-image:
        /* More squares at different positions */
        conic-gradient(from 0deg at 40% 30%, transparent 0deg, rgba(147, 51, 234, 0.15) 90deg, transparent 180deg, rgba(147, 51, 234, 0.15) 270deg, transparent 360deg),
        conic-gradient(from 45deg at 65% 55%, transparent 0deg, rgba(255, 107, 157, 0.12) 90deg, transparent 180deg, rgba(255, 107, 157, 0.12) 270deg, transparent 360deg),
        conic-gradient(from 30deg at 25% 75%, transparent 0deg, rgba(78, 205, 196, 0.13) 90deg, transparent 180deg, rgba(78, 205, 196, 0.13) 270deg, transparent 360deg),
        /* Stars (4-pointed) */
        conic-gradient(from 45deg at 50% 50%, rgba(255, 217, 61, 0.15) 0deg, transparent 45deg, rgba(255, 217, 61, 0.15) 90deg, transparent 135deg, rgba(255, 217, 61, 0.15) 180deg, transparent 225deg, rgba(255, 217, 61, 0.15) 270deg, transparent 315deg),
        conic-gradient(from 0deg at 90% 40%, rgba(147, 51, 234, 0.12) 0deg, transparent 45deg, rgba(147, 51, 234, 0.12) 90deg, transparent 135deg, rgba(147, 51, 234, 0.12) 180deg, transparent 225deg, rgba(147, 51, 234, 0.12) 270deg, transparent 315deg);
    animation: shapes-spin 25s linear infinite;
}

@keyframes balls-dance {
    0%, 100% {
        transform: translate(0, 0) scale(1);
    }
    25% {
        transform: translate(30px, -40px) scale(1.2);
    }
    50% {
        transform: translate(-20px, 20px) scale(0.9);
    }
    75% {
        transform: translate(40px, -10px) scale(1.1);
    }
}

@keyframes shapes-spin {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}

/* Business Card - Alpha */
body.parallel-alpha .business-card {
    background: linear-gradient(135deg, #0a192f 0%, #112240 100%);
    border: 3px solid #4ecdc4;
    box-shadow: 0 0 20px rgba(78, 205, 196, 0.6), 0 0 40px rgba(78, 205, 196, 0.3);
}

body.parallel-alpha .business-card h1,
body.parallel-alpha .business-card p,
body.parallel-alpha .business-card .title,
body.parallel-alpha .business-card .contact {
    color: #4ecdc4;
    text-shadow: 0 0 10px rgba(78, 205, 196, 0.8);
}

body.parallel-alpha .business-card .icon {
    color: #6bcf7f;
    filter: none;
}

/* Spinner - Alpha */
body.parallel-alpha .spinner-title {
    color: #4ecdc4;
    text-shadow: 0 0 10px rgba(78, 205, 196, 0.8);
}

body.parallel-alpha .spinner-border-container {
    background: linear-gradient(135deg, #0a192f 0%, #1a2332 100%);
    border: 3px solid #4ecdc4;
    box-shadow: 0 0 15px rgba(78, 205, 196, 0.5);
}

body.parallel-alpha .spinner-border-container::before {
    border: 3px solid #6bcf7f;
    box-shadow: 0 0 10px rgba(107, 207, 127, 0.5);
}

body.parallel-alpha .spinner-border-container::after {
    border: 3px solid #00d4ff;
    box-shadow: 0 0 15px rgba(0, 212, 255, 0.5);
}

body.parallel-alpha .spinner-container {
    background: linear-gradient(135deg, #0a192f 0%, #112240 100%);
}

body.parallel-alpha .spinner-container::before {
    border: 3px solid #64ffda;
    box-shadow: 0 0 12px rgba(100, 255, 218, 0.5);
}

body.parallel-alpha .spinner-container::after {
    border: 3px solid #00f5ff;
    box-shadow: 0 0 18px rgba(0, 245, 255, 0.5);
}

body.parallel-alpha .profession-display {
    color: #64ffda;
    text-shadow: 0 0 15px rgba(100, 255, 218, 1);
    font-family: 'Courier New', 'Consolas', monospace;
    font-weight: bold;
    letter-spacing: 2px;
}

/* Game Container - Alpha */
body.parallel-alpha .game-title {
    color: #4ecdc4;
    text-shadow: 0 0 10px rgba(78, 205, 196, 0.8);
}

body.parallel-alpha .game-border-container {
    background: linear-gradient(135deg, #0a192f 0%, #1a2332 100%);
    border: 3px solid #4ecdc4;
    box-shadow: 0 0 15px rgba(78, 205, 196, 0.5);
}

body.parallel-alpha .game-border-container::before {
    border: 3px solid #64ffda;
    box-shadow: 0 0 10px rgba(100, 255, 218, 0.5);
}

body.parallel-alpha .game-border-container::after {
    border: 3px solid #00f5ff;
    box-shadow: 0 0 15px rgba(0, 245, 255, 0.5);
}

/* Transpose Grid Cells - Alpha */
body.parallel-alpha .grid-cell.selected-first {
    background: linear-gradient(135deg, #4ecdc4 0%, #64ffda 100%);
    border-color: #4ecdc4;
    box-shadow: 0 0 20px rgba(78, 205, 196, 0.9), inset 0 2px 5px rgba(255, 255, 255, 0.5);
}

body.parallel-alpha .grid-cell.selected-second {
    background: linear-gradient(135deg, #ffa500 0%, #ff8c00 100%);
    border-color: #ff6b00;
    box-shadow: 0 0 20px rgba(255, 165, 0, 0.9), inset 0 2px 5px rgba(255, 255, 255, 0.5);
}

body.parallel-alpha #breakoutCanvas {
    background: linear-gradient(135deg, #0a0f1c 0%, #0d1b2a 100%);
}

body.parallel-alpha .game-score {
    color: #64ffda;
    text-shadow: 0 0 10px rgba(100, 255, 218, 1);
}

body.parallel-alpha .game-over {
    background: linear-gradient(135deg, rgba(10, 25, 47, 0.98) 0%, rgba(17, 34, 64, 0.98) 100%);
}

body.parallel-alpha .game-over p {
    color: #4ecdc4;
    text-shadow: 0 0 20px rgba(78, 205, 196, 1);
}

body.parallel-alpha .restart-btn {
    background: linear-gradient(135deg, #4ecdc4 0%, #6bcf7f 100%);
    color: #0a192f;
    border: 3px solid #64ffda;
    box-shadow: 0 0 20px rgba(78, 205, 196, 0.6);
    font-weight: bold;
}

body.parallel-alpha .restart-btn:hover {
    background: linear-gradient(135deg, #64ffda 0%, #00f5ff 100%);
    box-shadow: 0 0 30px rgba(100, 255, 218, 0.8);
}

/* Multiverse Box - Alpha */
body.parallel-alpha .multiverse-box .box-title {
    color: #4ecdc4;
    text-shadow: 0 0 15px rgba(78, 205, 196, 1);
}

body.parallel-alpha .multiverse-container {
    background: linear-gradient(135deg, #0a0f1c 0%, #0d1b2a 50%, #0a192f 100%);
    border: 3px solid #4ecdc4;
    box-shadow: 0 0 25px rgba(78, 205, 196, 0.6), inset 0 0 50px rgba(78, 205, 196, 0.1);
}

body.parallel-alpha .universe-bubble {
    border: 2px solid rgba(78, 205, 196, 0.6);
    box-shadow: 
        0 0 15px rgba(78, 205, 196, 0.4),
        inset 0 0 15px rgba(78, 205, 196, 0.2);
}

body.parallel-alpha .universe-bubble:hover {
    border-color: #64ffda;
    box-shadow: 
        0 0 30px rgba(100, 255, 218, 0.8),
        inset 0 0 25px rgba(100, 255, 218, 0.3);
}

body.parallel-alpha .universe-label {
    color: #64ffda;
    text-shadow: 0 0 10px rgba(100, 255, 218, 1);
}

/* Room Container - Alpha */
body.parallel-alpha .room-title {
    color: #4ecdc4;
    text-shadow: 0 0 10px rgba(78, 205, 196, 0.8);
}

body.parallel-alpha .room-border-container {
    background: linear-gradient(135deg, #0a192f 0%, #1a2332 100%);
    border: 3px solid #4ecdc4;
    box-shadow: 0 0 15px rgba(78, 205, 196, 0.5);
}

body.parallel-alpha .room-border-container::before {
    border: 3px solid #6bcf7f;
    box-shadow: 0 0 10px rgba(107, 207, 127, 0.5);
}

body.parallel-alpha .room-border-container::after {
    border: 3px solid #64ffda;
    box-shadow: 0 0 15px rgba(100, 255, 218, 0.5);
}

body.parallel-alpha .room-wrapper {
    background: linear-gradient(135deg, #0a0f1c 0%, #0d1b2a 100%);
}

/* Computer Box - Alpha */
body.parallel-alpha .computer-box {
    background: linear-gradient(135deg, #0a192f 0%, #112240 100%);
    border: 3px solid #4ecdc4;
    box-shadow: 0 0 20px rgba(78, 205, 196, 0.6);
}

body.parallel-alpha .computer-box .box-title {
    color: #64ffda;
    text-shadow: 0 0 15px rgba(100, 255, 218, 1);
}

/* Energy Module - Alpha */
body.parallel-alpha .energy-module {
    border: 3px solid #4ecdc4;
    background: linear-gradient(135deg, #0a192f 0%, #112240 100%);
    box-shadow: 0 0 20px rgba(78, 205, 196, 0.6);
}

body.parallel-alpha .energy-menu-bar {
    background: linear-gradient(135deg, #0d1b2a 0%, #1a2332 100%);
    border-bottom: 2px solid #4ecdc4;
    color: #64ffda;
}

body.parallel-alpha .energy-menu-item:hover {
    background: linear-gradient(135deg, #4ecdc4 0%, #6bcf7f 100%);
    color: #0a192f;
    box-shadow: 0 0 10px rgba(78, 205, 196, 0.8);
}

body.parallel-alpha .energy-dropdown {
    background: linear-gradient(135deg, #0d1b2a 0%, #1a2332 100%);
    border: 2px solid #4ecdc4;
    box-shadow: 0 0 15px rgba(78, 205, 196, 0.5);
}

body.parallel-alpha .energy-dropdown-item {
    color: #64ffda;
}

body.parallel-alpha .energy-dropdown-item:hover {
    background: linear-gradient(135deg, #4ecdc4 0%, #6bcf7f 100%);
    color: #0a192f;
}

body.parallel-alpha .energy-content {
    background: linear-gradient(135deg, #0a0f1c 0%, #0d1b2a 100%);
}

/* Transpose Machine - Alpha */
body.parallel-alpha .transpose-machine {
    background: linear-gradient(135deg, #4ecdc4 0%, #00d4ff 50%, #6bcf7f 100%);
    border: 4px solid #64ffda;
    box-shadow: 0 0 30px rgba(78, 205, 196, 0.8), inset 0 0 20px rgba(255, 255, 255, 0.3);
}

body.parallel-alpha .transpose-machine::before {
    border: 2px solid rgba(100, 255, 218, 0.6);
}

body.parallel-alpha .transpose-light {
    background: radial-gradient(circle at 30% 30%, #1a1a2e, #0a0f1c);
    border: 2px solid #4ecdc4;
}

body.parallel-alpha .transpose-light.on {
    background: radial-gradient(circle at 30% 30%, #64ffda, #4ecdc4);
    box-shadow: 0 0 20px rgba(100, 255, 218, 1), inset 0 1px 3px rgba(255, 255, 255, 0.6);
}

body.parallel-alpha .grid-container {
    background: linear-gradient(135deg, #0a0f1c 0%, #0d1b2a 100%);
    border: 3px solid #64ffda;
    box-shadow: inset 0 0 15px rgba(78, 205, 196, 0.4);
}

body.parallel-alpha .grid-cell {
    background: linear-gradient(135deg, #1a2332 0%, #0d1b2a 100%);
    border: 2px solid #4ecdc4;
    box-shadow: 0 0 5px rgba(78, 205, 196, 0.4);
}

body.parallel-alpha .grid-cell:hover {
    background: linear-gradient(135deg, #2a3342 0%, #1d2b3a 100%);
    box-shadow: 0 0 15px rgba(78, 205, 196, 0.8);
}

body.parallel-alpha .grid-cell.selected {
    background: linear-gradient(135deg, #64ffda 0%, #4ecdc4 100%);
    border-color: #00f5ff;
    box-shadow: 0 0 25px rgba(100, 255, 218, 1), inset 0 2px 8px rgba(255, 255, 255, 0.6);
}

body.parallel-alpha .transpose-button {
    background: radial-gradient(circle at 30% 30%, #64ffda, #4ecdc4, #00d4ff);
    border: 5px solid #0a192f;
    color: #0a192f;
    box-shadow: 0 0 25px rgba(100, 255, 218, 0.8), inset 0 2px 10px rgba(255, 255, 255, 0.5);
    font-weight: bold;
}

body.parallel-alpha .transpose-button:hover {
    background: radial-gradient(circle at 30% 30%, #00f5ff, #64ffda, #6bcf7f);
    box-shadow: 0 0 35px rgba(100, 255, 218, 1), inset 0 2px 12px rgba(255, 255, 255, 0.6);
}

/* Gamification Monetiser - Alpha */
body.parallel-alpha .gamification-monetiser {
    background: linear-gradient(135deg, #0a192f 0%, #112240 100%);
    border: 3px solid #4ecdc4;
    box-shadow: 0 0 20px rgba(78, 205, 196, 0.6);
}

body.parallel-alpha .gamification-monetiser .box-title {
    color: #4ecdc4;
    text-shadow: 0 0 10px rgba(78, 205, 196, 0.8);
}

body.parallel-alpha .enable-btn {
    background: linear-gradient(135deg, #4ecdc4 0%, #6bcf7f 100%);
    color: #0a192f;
    border: 3px solid #64ffda;
    box-shadow: 0 0 15px rgba(78, 205, 196, 0.6);
}

body.parallel-alpha .enable-btn:hover {
    background: linear-gradient(135deg, #64ffda 0%, #00f5ff 100%);
    box-shadow: 0 0 25px rgba(100, 255, 218, 0.8);
}

body.parallel-alpha .currency-selection h3 {
    color: #64ffda;
    text-shadow: 0 0 10px rgba(100, 255, 218, 0.8);
}

body.parallel-alpha .currency-btn {
    background: linear-gradient(135deg, #0d1b2a 0%, #1a2332 100%);
    color: #64ffda;
    border: 2px solid #4ecdc4;
    box-shadow: 0 0 10px rgba(78, 205, 196, 0.4);
}

body.parallel-alpha .currency-btn:hover {
    border-color: #64ffda;
    box-shadow: 0 0 20px rgba(100, 255, 218, 0.8);
}

body.parallel-alpha .currency-btn[data-currency="dokoin"]:hover {
    background: linear-gradient(135deg, #4ecdc4 0%, #6bcf7f 100%);
    color: #0a192f;
}

body.parallel-alpha .currency-btn[data-currency="gold"]:hover {
    background: linear-gradient(135deg, #64ffda 0%, #00d4ff 100%);
    color: #0a192f;
}

body.parallel-alpha .currency-btn[data-currency="hearts"]:hover {
    background: linear-gradient(135deg, #6bcf7f 0%, #4ecdc4 100%);
    color: #0a192f;
}

body.parallel-alpha .conversion-info {
    background: linear-gradient(135deg, #0a0f1c 0%, #0d1b2a 100%);
    border: 2px solid #4ecdc4;
    box-shadow: inset 0 0 10px rgba(78, 205, 196, 0.2);
}

body.parallel-alpha .conversion-info p {
    color: #64ffda;
}

/* Power Disabled States - Alpha */
body.parallel-alpha .gamification-monetiser.power-disabled::after,
body.parallel-alpha .transpose-machine.power-disabled::after {
    color: #ff6b9d;
    text-shadow: 0 0 15px rgba(255, 107, 157, 1);
}

/* Module Lights - Alpha */
body.parallel-alpha .module-light {
    border-color: #4ecdc4;
    background: radial-gradient(circle at 30% 30%, #0a192f, #0d1b2a);
}

body.parallel-alpha .module-light.active {
    background: radial-gradient(circle at 30% 30%, #64ffda, #4ecdc4);
    box-shadow: 0 0 15px rgba(100, 255, 218, 1), inset 0 1px 3px rgba(255, 255, 255, 0.6);
}

body.parallel-alpha .gamification-monetiser.powering-up,
body.parallel-alpha .transpose-machine.powering-up {
    animation: power-up-glow-alpha 2s ease-out;
}

@keyframes power-up-glow-alpha {
    0% {
        box-shadow: 0 0 20px rgba(78, 205, 196, 0.6);
    }
    50% {
        box-shadow: 0 0 40px rgba(100, 255, 218, 1), 0 0 80px rgba(78, 205, 196, 0.8);
    }
    100% {
        box-shadow: 0 0 20px rgba(78, 205, 196, 0.6);
    }
}


/* ====================================
   PARALLEL BETA THEME
   Purple/Gold mystical aesthetic with ornate borders
   ==================================== */

body.parallel-beta {
    background: linear-gradient(135deg, #1a0033 0%, #2d0052 50%, #1f0040 100%);
    font-family: 'Georgia', 'Times New Roman', serif;
}

body.parallel-beta .content-container {
    background: radial-gradient(circle at center, rgba(155, 89, 182, 0.08) 0%, transparent 70%);
}

/* Dancing Animation for Parallel Beta */
@keyframes mystical-float {
    0%, 100% {
        transform: translateY(0px) rotate(0deg);
    }
    25% {
        transform: translateY(-15px) rotate(2deg);
    }
    50% {
        transform: translateY(-8px) rotate(-1deg);
    }
    75% {
        transform: translateY(-20px) rotate(1.5deg);
    }
}

@keyframes mystical-sway {
    0%, 100% {
        transform: translateX(0px) rotate(0deg);
    }
    33% {
        transform: translateX(10px) rotate(-1.5deg);
    }
    66% {
        transform: translateX(-10px) rotate(1.5deg);
    }
}

@keyframes mystical-pulse {
    0%, 100% {
        transform: scale(1) rotate(0deg);
    }
    50% {
        transform: scale(1.03) rotate(1deg);
    }
}

body.parallel-beta .content-item {
    animation-timing-function: ease-in-out;
    animation-iteration-count: infinite;
}

body.parallel-beta .business-card {
    animation: mystical-float 6s ease-in-out infinite;
}

body.parallel-beta .profession-spinner {
    animation: mystical-sway 7s ease-in-out infinite;
}

body.parallel-beta .game-container {
    animation: mystical-pulse 5s ease-in-out infinite;
}

body.parallel-beta .multiverse-box {
    animation: mystical-float 8s ease-in-out infinite;
}

body.parallel-beta .room-container {
    animation: mystical-sway 6.5s ease-in-out infinite;
}

body.parallel-beta .computer-box {
    animation: mystical-pulse 7.5s ease-in-out infinite;
}

body.parallel-beta .energy-module {
    animation: mystical-float 5.5s ease-in-out infinite;
}

body.parallel-beta .transpose-machine {
    animation: mystical-sway 8.5s ease-in-out infinite;
}

body.parallel-beta .post-it {
    animation: mystical-float 7s ease-in-out infinite;
}

body.parallel-beta .post-it:nth-child(1) {
    animation-delay: 0s;
}

body.parallel-beta .post-it:nth-child(2) {
    animation-delay: 0.5s;
}

body.parallel-beta .post-it:nth-child(3) {
    animation-delay: 1s;
}

/* Business Card - Beta */
body.parallel-beta .business-card {
    background: linear-gradient(135deg, #1a0033 0%, #2d0052 100%);
    border: 4px double #ffd93d;
    box-shadow: 0 0 25px rgba(255, 217, 61, 0.7), 0 0 50px rgba(155, 89, 182, 0.4);
}

body.parallel-beta .business-card h1,
body.parallel-beta .business-card p,
body.parallel-beta .business-card .title,
body.parallel-beta .business-card .contact {
    color: #ffd93d;
    text-shadow: 0 0 15px rgba(255, 217, 61, 0.9), 0 0 25px rgba(155, 89, 182, 0.6);
}

body.parallel-beta .business-card .icon {
    color: #ff6b9d;
    filter: none;
}

/* Spinner - Beta */
body.parallel-beta .spinner-title {
    color: #ffd93d;
    text-shadow: 0 0 15px rgba(255, 217, 61, 1);
    font-family: 'Georgia', serif;
}

body.parallel-beta .spinner-border-container {
    background: linear-gradient(135deg, #1a0033 0%, #2d0052 100%);
    border: 4px double #ffd93d;
    box-shadow: 0 0 20px rgba(255, 217, 61, 0.6);
}

body.parallel-beta .spinner-border-container::before {
    border: 4px ridge #9b59b6;
    box-shadow: 0 0 15px rgba(155, 89, 182, 0.6);
}

body.parallel-beta .spinner-border-container::after {
    border: 4px groove #ff6b9d;
    box-shadow: 0 0 20px rgba(255, 107, 157, 0.6);
}

body.parallel-beta .spinner-container {
    background: linear-gradient(135deg, #1a0033 0%, #2d0052 100%);
}

body.parallel-beta .spinner-container::before {
    border: 4px dotted #c44569;
    box-shadow: 0 0 18px rgba(196, 69, 105, 0.6);
}

body.parallel-beta .spinner-container::after {
    border: 4px dashed #ff9ff3;
    box-shadow: 0 0 22px rgba(255, 159, 243, 0.6);
}

body.parallel-beta .profession-display {
    color: #ffd93d;
    text-shadow: 0 0 20px rgba(255, 217, 61, 1), 0 0 30px rgba(255, 107, 157, 0.8);
    font-family: 'Georgia', serif;
    font-weight: bold;
    letter-spacing: 3px;
    font-style: italic;
}

/* Game Container - Beta */
body.parallel-beta .game-title {
    color: #ffd93d;
    text-shadow: 0 0 15px rgba(255, 217, 61, 1);
    font-family: 'Georgia', serif;
}

body.parallel-beta .game-border-container {
    background: linear-gradient(135deg, #1a0033 0%, #2d0052 100%);
    border: 4px double #ffd93d;
    box-shadow: 0 0 20px rgba(255, 217, 61, 0.6);
}

body.parallel-beta .game-border-container::before {
    border: 4px ridge #9b59b6;
    box-shadow: 0 0 15px rgba(155, 89, 182, 0.6);
}

body.parallel-beta .game-border-container::after {
    border: 4px groove #ff6b9d;
    box-shadow: 0 0 20px rgba(255, 107, 157, 0.6);
}

/* Transpose Grid Cells - Beta */
body.parallel-beta .grid-cell.selected-first {
    background: linear-gradient(135deg, #4ecdc4 0%, #64ffda 100%);
    border-color: #4ecdc4;
    box-shadow: 0 0 20px rgba(78, 205, 196, 0.9), inset 0 2px 5px rgba(255, 255, 255, 0.5);
}

body.parallel-beta .grid-cell.selected-second {
    background: linear-gradient(135deg, #ffa500 0%, #ff8c00 100%);
    border-color: #ff6b00;
    box-shadow: 0 0 20px rgba(255, 165, 0, 0.9), inset 0 2px 5px rgba(255, 255, 255, 0.5);
}

body.parallel-beta #breakoutCanvas {
    background: linear-gradient(135deg, #0f001f 0%, #1a0033 100%);
}

body.parallel-beta .game-score {
    color: #ffd93d;
    text-shadow: 0 0 15px rgba(255, 217, 61, 1);
}

body.parallel-beta .game-over {
    background: linear-gradient(135deg, rgba(26, 0, 51, 0.98) 0%, rgba(45, 0, 82, 0.98) 100%);
}

body.parallel-beta .game-over p {
    color: #ffd93d;
    text-shadow: 0 0 25px rgba(255, 217, 61, 1), 0 0 35px rgba(255, 107, 157, 0.8);
}

body.parallel-beta .restart-btn {
    background: linear-gradient(135deg, #ffd93d 0%, #ff6b9d 100%);
    color: #1a0033;
    border: 4px double #9b59b6;
    box-shadow: 0 0 25px rgba(255, 217, 61, 0.8);
    font-weight: bold;
}

body.parallel-beta .restart-btn:hover {
    background: linear-gradient(135deg, #ff9ff3 0%, #ffd93d 100%);
    box-shadow: 0 0 35px rgba(255, 159, 243, 1);
}

/* Multiverse Box - Beta */
body.parallel-beta .multiverse-box .box-title {
    color: #ffd93d;
    text-shadow: 0 0 20px rgba(255, 217, 61, 1), 0 0 30px rgba(155, 89, 182, 0.8);
    font-family: 'Georgia', serif;
}

body.parallel-beta .multiverse-container {
    background: linear-gradient(135deg, #0f001f 0%, #1a0033 50%, #2d0052 100%);
    border: 4px double #ffd93d;
    box-shadow: 0 0 30px rgba(255, 217, 61, 0.7), inset 0 0 60px rgba(155, 89, 182, 0.3);
}

body.parallel-beta .universe-bubble {
    border: 3px double rgba(255, 217, 61, 0.7);
    box-shadow: 
        0 0 20px rgba(255, 217, 61, 0.5),
        inset 0 0 20px rgba(155, 89, 182, 0.3);
}

body.parallel-beta .universe-bubble:hover {
    border-color: #ff9ff3;
    box-shadow: 
        0 0 35px rgba(255, 159, 243, 1),
        inset 0 0 30px rgba(255, 107, 157, 0.5);
}

body.parallel-beta .universe-label {
    color: #ffd93d;
    text-shadow: 0 0 15px rgba(255, 217, 61, 1), 0 0 25px rgba(155, 89, 182, 0.8);
    font-family: 'Georgia', serif;
}

/* Room Container - Beta */
body.parallel-beta .room-title {
    color: #ffd93d;
    text-shadow: 0 0 15px rgba(255, 217, 61, 1);
    font-family: 'Georgia', serif;
}

body.parallel-beta .room-border-container {
    background: linear-gradient(135deg, #1a0033 0%, #2d0052 100%);
    border: 4px double #ffd93d;
    box-shadow: 0 0 20px rgba(255, 217, 61, 0.6);
}

body.parallel-beta .room-border-container::before {
    border: 4px ridge #9b59b6;
    box-shadow: 0 0 15px rgba(155, 89, 182, 0.6);
}

body.parallel-beta .room-border-container::after {
    border: 4px groove #ff6b9d;
    box-shadow: 0 0 20px rgba(255, 107, 157, 0.6);
}

body.parallel-beta .room-wrapper {
    background: linear-gradient(135deg, #0f001f 0%, #1a0033 100%);
}

/* Computer Box - Beta */
body.parallel-beta .computer-box {
    background: linear-gradient(135deg, #1a0033 0%, #2d0052 100%);
    border: 4px double #ffd93d;
    box-shadow: 0 0 25px rgba(255, 217, 61, 0.7);
}

body.parallel-beta .computer-box .box-title {
    color: #ffd93d;
    text-shadow: 0 0 20px rgba(255, 217, 61, 1), 0 0 30px rgba(155, 89, 182, 0.8);
    font-family: 'Georgia', serif;
}

/* Energy Module - Beta */
body.parallel-beta .energy-module {
    border: 4px double #ffd93d;
    background: linear-gradient(135deg, #1a0033 0%, #2d0052 100%);
    box-shadow: 0 0 25px rgba(255, 217, 61, 0.7);
}

body.parallel-beta .energy-menu-bar {
    background: linear-gradient(135deg, #2d0052 0%, #3d0066 100%);
    border-bottom: 3px ridge #ffd93d;
    color: #ffd93d;
}

body.parallel-beta .energy-menu-item:hover {
    background: linear-gradient(135deg, #ffd93d 0%, #ff6b9d 100%);
    color: #1a0033;
    box-shadow: 0 0 15px rgba(255, 217, 61, 1);
}

body.parallel-beta .energy-dropdown {
    background: linear-gradient(135deg, #2d0052 0%, #3d0066 100%);
    border: 3px ridge #ffd93d;
    box-shadow: 0 0 20px rgba(255, 217, 61, 0.6);
}

body.parallel-beta .energy-dropdown-item {
    color: #ffd93d;
}

body.parallel-beta .energy-dropdown-item:hover {
    background: linear-gradient(135deg, #ffd93d 0%, #ff6b9d 100%);
    color: #1a0033;
}

body.parallel-beta .energy-content {
    background: linear-gradient(135deg, #0f001f 0%, #1a0033 100%);
}

/* Transpose Machine - Beta */
body.parallel-beta .transpose-machine {
    background: linear-gradient(135deg, #ff6b9d 0%, #9b59b6 50%, #ffd93d 100%);
    border: 5px ridge #ffd93d;
    box-shadow: 0 0 35px rgba(255, 217, 61, 0.9), inset 0 0 25px rgba(255, 255, 255, 0.4);
}

body.parallel-beta .transpose-machine::before {
    border: 3px double rgba(255, 217, 61, 0.8);
}

body.parallel-beta .transpose-light {
    background: radial-gradient(circle at 30% 30%, #2d0052, #1a0033);
    border: 2px solid #ffd93d;
}

body.parallel-beta .transpose-light.on {
    background: radial-gradient(circle at 30% 30%, #ffd93d, #ff6b9d);
    box-shadow: 0 0 25px rgba(255, 217, 61, 1), inset 0 1px 3px rgba(255, 255, 255, 0.7);
}

body.parallel-beta .grid-container {
    background: linear-gradient(135deg, #0f001f 0%, #1a0033 100%);
    border: 4px ridge #ffd93d;
    box-shadow: inset 0 0 20px rgba(155, 89, 182, 0.5);
}

body.parallel-beta .grid-cell {
    background: linear-gradient(135deg, #2d0052 0%, #1a0033 100%);
    border: 2px solid #9b59b6;
    box-shadow: 0 0 8px rgba(155, 89, 182, 0.5);
}

body.parallel-beta .grid-cell:hover {
    background: linear-gradient(135deg, #3d0066 0%, #2d0052 100%);
    box-shadow: 0 0 18px rgba(155, 89, 182, 0.9);
}

body.parallel-beta .grid-cell.selected {
    background: linear-gradient(135deg, #ffd93d 0%, #ff6b9d 100%);
    border-color: #ff9ff3;
    box-shadow: 0 0 30px rgba(255, 217, 61, 1), inset 0 2px 10px rgba(255, 255, 255, 0.7);
}

body.parallel-beta .transpose-button {
    background: radial-gradient(circle at 30% 30%, #ffd93d, #ff6b9d, #9b59b6);
    border: 6px groove #1a0033;
    color: #1a0033;
    box-shadow: 0 0 30px rgba(255, 217, 61, 1), inset 0 2px 12px rgba(255, 255, 255, 0.6);
    font-weight: bold;
    font-family: 'Georgia', serif;
}

body.parallel-beta .transpose-button:hover {
    background: radial-gradient(circle at 30% 30%, #ff9ff3, #ffd93d, #c44569);
    box-shadow: 0 0 40px rgba(255, 159, 243, 1), inset 0 2px 15px rgba(255, 255, 255, 0.7);
}

/* Post-it Notes - Alpha */
body.parallel-alpha .post-it {
    background: linear-gradient(135deg, #0d1b2a 0%, #1a2332 100%);
    border: 2px solid #4ecdc4;
    box-shadow: 0 5px 15px rgba(78, 205, 196, 0.4);
    color: #64ffda;
}

body.parallel-alpha .post-it:nth-child(1) {
    background: linear-gradient(135deg, #0d1b2a 0%, #1a2332 100%);
}

body.parallel-alpha .post-it:nth-child(2) {
    background: linear-gradient(135deg, #1a2e3d 0%, #0f1c29 100%);
}

body.parallel-alpha .post-it:nth-child(3) {
    background: linear-gradient(135deg, #0a192f 0%, #112240 100%);
}

body.parallel-alpha .post-it-title,
body.parallel-alpha .post-it-text {
    color: #64ffda;
    text-shadow: 0 0 5px rgba(100, 255, 218, 0.6);
}

body.parallel-alpha .post-it-title {
    color: #4ecdc4;
    text-shadow: 0 0 10px rgba(78, 205, 196, 0.8);
    border-bottom: 2px solid #64ffda;
}

body.parallel-alpha .post-it h3 {
    color: #4ecdc4;
    text-shadow: 0 0 10px rgba(78, 205, 196, 0.8);
    border-bottom: 2px solid #64ffda;
}

body.parallel-alpha .post-it ul li::before {
    color: #6bcf7f;
}

/* Post-it Notes - Beta */
body.parallel-beta .post-it {
    background: linear-gradient(135deg, #2d0052 0%, #3d0066 100%);
    border: 3px ridge #ffd93d;
    box-shadow: 0 8px 20px rgba(255, 217, 61, 0.5);
    color: #ffd93d;
}

body.parallel-beta .post-it:nth-child(1) {
    background: linear-gradient(135deg, #2d0052 0%, #3d0066 100%);
}

body.parallel-beta .post-it:nth-child(2) {
    background: linear-gradient(135deg, #3d0066 0%, #4d0080 100%);
}

body.parallel-beta .post-it:nth-child(3) {
    background: linear-gradient(135deg, #1a0033 0%, #2d0052 100%);
}

body.parallel-beta .post-it-title,
body.parallel-beta .post-it-text {
    color: #ffd93d;
    text-shadow: 0 0 8px rgba(255, 217, 61, 0.8);
    font-family: 'Georgia', serif;
}

body.parallel-beta .post-it-title {
    color: #ff6b9d;
    text-shadow: 0 0 15px rgba(255, 107, 157, 1);
    border-bottom: 2px solid #ffd93d;
}

body.parallel-beta .post-it h3 {
    color: #ffd93d;
    text-shadow: 0 0 15px rgba(255, 217, 61, 1);
    border-bottom: 2px solid #ff6b9d;
    font-family: 'Georgia', serif;
}

body.parallel-beta .post-it ul li::before {
    color: #ff6b9d;
}

/* Gamification Monetiser - Beta */
body.parallel-beta .gamification-monetiser {
    background: linear-gradient(135deg, #1a0033 0%, #2d0052 100%);
    border: 4px double #ffd93d;
    box-shadow: 0 0 25px rgba(255, 217, 61, 0.7);
}

body.parallel-beta .gamification-monetiser .box-title {
    color: #ffd93d;
    text-shadow: 0 0 15px rgba(255, 217, 61, 1);
    font-family: 'Georgia', serif;
}

body.parallel-beta .enable-btn {
    background: linear-gradient(135deg, #ffd93d 0%, #ff6b9d 100%);
    color: #1a0033;
    border: 4px double #9b59b6;
    box-shadow: 0 0 20px rgba(255, 217, 61, 0.8);
}

body.parallel-beta .enable-btn:hover {
    background: linear-gradient(135deg, #ff9ff3 0%, #ffd93d 100%);
    box-shadow: 0 0 30px rgba(255, 159, 243, 1);
}

body.parallel-beta .currency-selection h3 {
    color: #ffd93d;
    text-shadow: 0 0 15px rgba(255, 217, 61, 1);
    font-family: 'Georgia', serif;
}

body.parallel-beta .currency-btn {
    background: linear-gradient(135deg, #2d0052 0%, #3d0066 100%);
    color: #ffd93d;
    border: 3px ridge #9b59b6;
    box-shadow: 0 0 12px rgba(155, 89, 182, 0.5);
}

body.parallel-beta .currency-btn:hover {
    border-color: #ffd93d;
    box-shadow: 0 0 25px rgba(255, 217, 61, 0.9);
}

body.parallel-beta .currency-btn[data-currency="dokoin"]:hover {
    background: linear-gradient(135deg, #9b59b6 0%, #c44569 100%);
    color: #ffd93d;
}

body.parallel-beta .currency-btn[data-currency="gold"]:hover {
    background: linear-gradient(135deg, #ffd93d 0%, #ff6b9d 100%);
    color: #1a0033;
}

body.parallel-beta .currency-btn[data-currency="hearts"]:hover {
    background: linear-gradient(135deg, #ff6b9d 0%, #ff9ff3 100%);
    color: #1a0033;
}

body.parallel-beta .conversion-info {
    background: linear-gradient(135deg, #0f001f 0%, #1a0033 100%);
    border: 3px ridge #ffd93d;
    box-shadow: inset 0 0 15px rgba(155, 89, 182, 0.3);
}

body.parallel-beta .conversion-info p {
    color: #ffd93d;
}

/* Power Disabled States - Beta */
body.parallel-beta .gamification-monetiser.power-disabled::after,
body.parallel-beta .transpose-machine.power-disabled::after {
    color: #ff6b9d;
    text-shadow: 0 0 20px rgba(255, 107, 157, 1), 0 0 30px rgba(255, 217, 61, 0.8);
}

/* Module Lights - Beta */
body.parallel-beta .module-light {
    border-color: #ffd93d;
    background: radial-gradient(circle at 30% 30%, #1a0033, #2d0052);
}

body.parallel-beta .module-light.active {
    background: radial-gradient(circle at 30% 30%, #ffd93d, #ff6b9d);
    box-shadow: 0 0 15px rgba(255, 217, 61, 1), inset 0 1px 3px rgba(255, 255, 255, 0.7);
}

body.parallel-beta .gamification-monetiser.powering-up,
body.parallel-beta .transpose-machine.powering-up {
    animation: power-up-glow-beta 2s ease-out;
}

@keyframes power-up-glow-beta {
    0% {
        box-shadow: 0 0 25px rgba(255, 217, 61, 0.7);
    }
    50% {
        box-shadow: 0 0 50px rgba(255, 217, 61, 1), 0 0 100px rgba(255, 107, 157, 0.8);
    }
    100% {
        box-shadow: 0 0 25px rgba(255, 217, 61, 0.7);
    }
}

/* Pac-Man Game - Alpha */
body.parallel-alpha .pacman-game {
    background: linear-gradient(135deg, #0a192f 0%, #1a2332 100%);
    border: 3px solid #4ecdc4;
    box-shadow: 0 0 20px rgba(78, 205, 196, 0.6);
}

body.parallel-alpha .pacman-game .box-title {
    color: #4ecdc4;
    text-shadow: 0 0 10px rgba(78, 205, 196, 0.8);
}

body.parallel-alpha .pacman-score {
    color: #64ffda;
    background-color: rgba(10, 25, 47, 0.8);
    border: 2px solid #4ecdc4;
    text-shadow: 0 0 5px rgba(100, 255, 218, 0.8);
}

body.parallel-alpha .pacman-instructions {
    color: #4ecdc4;
    border: 2px dashed #64ffda;
    background-color: rgba(10, 25, 47, 0.3);
}

body.parallel-alpha .pacman-game-over h3 {
    color: #ff6b9d;
    text-shadow: 0 0 10px rgba(255, 107, 157, 1);
}

body.parallel-alpha .pacman-game-over p {
    color: #64ffda;
}

body.parallel-alpha #pacmanFinalScore {
    color: #4ecdc4;
    text-shadow: 0 0 10px rgba(78, 205, 196, 0.8);
}

body.parallel-alpha #pacmanCharacter {
    background: #64ffda;
    box-shadow: 0 0 20px rgba(100, 255, 218, 0.8), 0 0 40px rgba(78, 205, 196, 0.5);
}

/* Pac-Man Game - Beta */
body.parallel-beta .pacman-game {
    background: linear-gradient(135deg, #1a0033 0%, #2d0052 100%);
    border: 4px double #ffd93d;
    box-shadow: 0 0 25px rgba(255, 217, 61, 0.7);
}

body.parallel-beta .pacman-game .box-title {
    color: #ffd93d;
    text-shadow: 0 0 15px rgba(255, 217, 61, 1);
    font-family: 'Georgia', serif;
}

body.parallel-beta .pacman-score {
    color: #ffd93d;
    background-color: rgba(26, 0, 51, 0.8);
    border: 3px ridge #ff6b9d;
    text-shadow: 0 0 8px rgba(255, 217, 61, 0.8);
    font-family: 'Georgia', serif;
}

body.parallel-beta .pacman-instructions {
    color: #ffd93d;
    border: 2px dashed #ff6b9d;
    background-color: rgba(26, 0, 51, 0.3);
    font-family: 'Georgia', serif;
}

body.parallel-beta .pacman-game-over h3 {
    color: #ff6b9d;
    text-shadow: 0 0 15px rgba(255, 107, 157, 1), 0 0 25px rgba(255, 217, 61, 0.8);
}

body.parallel-beta .pacman-game-over p {
    color: #ffd93d;
    font-family: 'Georgia', serif;
}

body.parallel-beta #pacmanFinalScore {
    color: #ffd93d;
    text-shadow: 0 0 15px rgba(255, 217, 61, 1);
}

body.parallel-beta #pacmanCharacter {
    background: linear-gradient(135deg, #ffd93d 0%, #ff6b9d 100%);
    box-shadow: 0 0 25px rgba(255, 217, 61, 1), 0 0 50px rgba(255, 107, 157, 0.8);
}

/* Mobile optimizations for parallel-alpha plasma effects */
@media (max-width: 768px) {
    body.parallel-alpha::before,
    body.parallel-alpha::after {
        /* Ensure effects are visible on mobile */
        will-change: transform, opacity;
        -webkit-transform: translateZ(0);
        transform: translateZ(0);
    }
    
    body.parallel-alpha .content-container::before,
    body.parallel-alpha .content-container::after {
        will-change: transform;
        -webkit-transform: translateZ(0);
        transform: translateZ(0);
    }
}