@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;600;700&display=swap');
body {
    font-family: 'Inter', sans-serif;
    background-color: #f7f3e8; /* Soft background */
}
.container {
    max-width: 1200px;
}
.card {
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -2px rgba(0, 0, 0, 0.06);
}
/* Custom scrollbar for gallery */
#catGallery::-webkit-scrollbar, #tagSelector::-webkit-scrollbar {
    width: 8px;
}
#catGallery::-webkit-scrollbar-thumb, #tagSelector::-webkit-scrollbar-thumb {
    background-color: #a855f7; /* Violet-500 */
    border-radius: 4px;
}
#catGallery::-webkit-scrollbar-track, #tagSelector::-webkit-scrollbar-track {
    background: #f7f3e8;
}

/* --- UI Switching Logic (New) --- */

/* By default, hide the desktop view */
.desktop-ui {
    display: none;
}

/* Show the desktop view (2-column layout) only on large screens (1024px and up) */
@media (min-width: 1024px) {
    .desktop-ui {
        display: block;
    }
    .mobile-ui {
        display: none;
    }
}

/* Show the mobile view (single column layout) on small/medium screens (up to 1023px) */
@media (max-width: 1023px) {
    .desktop-ui {
        display: none;
    }
    .mobile-ui {
        display: block;
    }
}