style.css

@import url('https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@300;400;500;600;700&family=Inter:wght@300;400;500;600;700&display=swap');

* {
    font-family: 'Inter', sans-serif;
}

body {
    margin: 0;
    padding: 0;
    overflow: hidden;
}

canvas {
    display: block;
}

.code-font {
    font-family: 'JetBrains Mono', monospace;
}

.fade-in {
    animation: fadeIn 0.5s ease-in-out;
}

@keyframes fadeIn {
    from { opacity: 0; transform: translateY(20px); }
    to { opacity: 1; transform: translateY(0); }
}

.pulse-cyan {
    animation: pulseCyan 2s infinite;
}

@keyframes pulseCyan {
    0%, 100% { box-shadow: 0 0 0 0 rgba(6, 182, 212, 0.7); }
    50% { box-shadow: 0 0 0 10px rgba(6, 182, 212, 0); }
}

.gradient-border {
    background: linear-gradient(white, white) padding-box,
                linear-gradient(45deg, #06b6d4, #0891b2) border-box;
    border: 2px solid transparent;
}

.file-item {
    transition: all 0.3s ease;
}

.file-item:hover {
    transform: translateX(4px);
    background-color: #f0fdfa;
}

.lcs-tag {
    transition: all 0.3s ease;
}

.lcs-tag:hover {
    transform: scale(1.05);
    box-shadow: 0 4px 12px rgba(6, 182, 212, 0.3);
}