@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+SC:wght@400;500;700&display=swap');

:root {
    --primary: #4f46e5;
    --primary-light: #6366f1;
    --primary-dark: #4338ca;
    --secondary: #10b981;
    --secondary-light: #34d399;
    --secondary-dark: #059669;
}

body {
    font-family: 'Noto Sans SC', sans-serif;
}

.h-screen-minus-nav {
    height: calc(100vh - 64px);
}

.slide-container {
    background: linear-gradient(135deg, #f9fafb 0%, #f3f4f6 100%);
}

.slide-content {
    min-height: 400px;
}

.slide-shadow {
    box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.1), 
                0 10px 10px -5px rgba(0, 0, 0, 0.04);
}

.slide-border {
    border-radius: 8px 8px 0 0;
}

.progress-bar {
    transition: width 0.3s ease;
}

.chinese-char {
    font-size: 2rem;
    line-height: 1.2;
}

.transition-slide {
    transition: transform 0.3s ease-in-out;
}

/* Animation for fullscreen slide */
@keyframes slideIn {
    from { transform: scale(0.9); opacity: 0; }
    to { transform: scale(1); opacity: 1; }
}

.fullscreen-slide {
    animation: slideIn 0.3s ease-out forwards;
}