/* 
 * LunaStudy 网格布局工具
 */

.grid-cols-auto {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 24px;
}

.grid-cols-responsive {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 24px;
}

@media (max-width: 768px) {
    .grid-cols-auto,
    .grid-cols-responsive {
        grid-template-columns: 1fr;
        gap: 16px;
    }
}