/* ===== PEEKING ROBOT ===== */

/* Hide robot when hammer mode is active */
/* body.hammer-mode .peeking-robot {
    display: none !important;
} */

.peeking-robot {
    position: fixed;
    right: -100px;
    left: auto;
    top: 50%;
    transform: translateY(-50%);
    z-index: 50;
    color: var(--accent);
    transition: right 0.6s cubic-bezier(0.4, 0, 0.9, 0.4),
                left 0.6s cubic-bezier(0.4, 0, 0.9, 0.4),
                top 0.3s ease-out;
    cursor: pointer;
}

.peeking-robot.side-right {
    right: -100px;
    left: auto;
    margin-right: 16px;
}

.peeking-robot.side-left {
    left: -100px;
    right: auto;
    margin-left: 16px;
    transform: translateY(-50%) scaleX(-1); /* Flip to face inward */
}

.peeking-robot.visible.side-right {
    right: 0px;
    transition: right 0.7s cubic-bezier(0.16, 1, 0.3, 1);
}

.peeking-robot.visible.side-left {
    left: 0px;
    transition: left 0.7s cubic-bezier(0.16, 1, 0.3, 1);
}

.peeking-robot.peek.side-right {
    right: -20px;
    transition: right 0.6s cubic-bezier(0.16, 1, 0.3, 1);
}

.peeking-robot.peek.side-left {
    left: -20px;
    transition: left 0.6s cubic-bezier(0.16, 1, 0.3, 1);
}

.peeking-robot.hiding {
    transition: right 0.4s cubic-bezier(0.4, 0, 1, 1),
                left 0.4s cubic-bezier(0.4, 0, 1, 1);
}

.peeking-robot.hiding.side-right {
    right: -120px;
}

.peeking-robot.hiding.side-left {
    left: -120px;
}

.robot-head {
    display: none;
    filter: drop-shadow(-4px 4px 8px rgba(0, 0, 0, 0.15));
}

.peeking-robot.show-normal .robot-normal,
.peeking-robot.show-weird .robot-weird {
    display: block;
}

.robot-weird {
    filter: drop-shadow(-4px 4px 8px rgba(0, 0, 0, 0.15)) 
            sepia(0.15) 
            saturate(0.85);
}

.robot-hand {
    position: absolute;
    left: -24px;
    top: 50%;
    transform: translateY(-50%);
}

.pincer-top {
    transform-origin: 10px 18px;
}

.pincer-bottom {
    transform-origin: 18px 18px;
}

.peeking-robot:hover .pincer-top,
.peeking-robot.peek .pincer-top {
    animation: pinch-top 0.8s ease-in-out infinite;
}

.peeking-robot:hover .pincer-bottom,
.peeking-robot.peek .pincer-bottom {
    animation: pinch-bottom 0.8s ease-in-out infinite;
}

@keyframes pinch-top {
    0%, 100% { transform: rotate(0deg); }
    50% { transform: rotate(10deg); }
}

@keyframes pinch-bottom {
    0%, 100% { transform: rotate(0deg); }
    50% { transform: rotate(-10deg); }
}

.antenna-dot {
    animation: antenna-blink 3s ease-in-out infinite;
}

@keyframes antenna-blink {
    0%, 90%, 100% { opacity: 1; }
    95% { opacity: 0.3; }
}

.robot-eyes .pupil {
    transition: transform 0.1s ease-out;
}

.blush {
    transition: opacity 0.3s ease;
}

.peeking-robot:hover .blush {
    opacity: 0.7;
}

/* Theme variants */
[data-theme="terminal"] .peeking-robot {
    color: var(--accent);
}

[data-theme="terminal"] .robot-head {
    filter: drop-shadow(-4px 4px 12px rgba(0, 243, 255, 0.3));
}

/* Mobile robot styles */
@media (max-width: 768px) {
    .peeking-robot {
        transform: translateY(-50%) scale(0.7);
    }
    
    .peeking-robot.side-left {
        transform: translateY(-50%) scale(0.7) scaleX(-1);
    }
    
    .peeking-robot.crossing {
        transition: left 8s linear, right 8s linear;
    }
    
    .peeking-robot.crossing-right {
        left: -80px;
        right: auto;
        transform: translateY(-50%) scale(0.7);
    }
    
    .peeking-robot.crossing-left {
        right: -80px;
        left: auto;
        transform: translateY(-50%) scale(0.7) scaleX(-1);
    }
    
    .peeking-robot.floating.crossing-right {
        animation: float-bob-right 2s ease-in-out infinite;
    }
    
    .peeking-robot.floating.crossing-left {
        animation: float-bob-left 2s ease-in-out infinite;
    }
    
    @keyframes float-bob-right {
        0%, 100% { transform: translateY(-50%) scale(0.7); }
        50% { transform: translateY(calc(-50% - 10px)) scale(0.7); }
    }
    
    @keyframes float-bob-left {
        0%, 100% { transform: translateY(-50%) scale(0.7) scaleX(-1); }
        50% { transform: translateY(calc(-50% - 10px)) scale(0.7) scaleX(-1); }
    }
    
    .peeking-robot.stopped {
        transform: translateY(-50%) scale(1.2) !important;
        z-index: 9999;
    }
    
    .peeking-robot.vanish {
        opacity: 0;
        transform: translateY(-50%) scale(0) !important;
        transition: opacity 0.3s ease, transform 0.3s ease;
    }
    
    .peeking-robot.jumpscare {
        left: 50% !important;
        right: auto !important;
        top: 50% !important;
        transform: translate(-50%, -50%) scale(3) !important;
        opacity: 0.7;
        transition: all 0.15s cubic-bezier(0.2, 0, 0.2, 1);
        z-index: 9999;
    }
}
