        body {
            background-color: #fff8f5;
            color: #1e1b18;
            -webkit-tap-highlight-color: transparent;
        }
        .material-symbols-outlined {
            font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
            display: inline-block;
            vertical-align: middle;
        }
        .hide-scrollbar::-webkit-scrollbar { display: none; }
        .hide-scrollbar {
            -ms-overflow-style: none;
            scrollbar-width: none;
        }
        .custom-scrollbar::-webkit-scrollbar { width: 4px; }
        .custom-scrollbar::-webkit-scrollbar-track { background: transparent; }
        .custom-scrollbar::-webkit-scrollbar-thumb { background: #c3c8bf; border-radius: 10px; }
        .recipe-card-shadow {
            box-shadow: 0 4px 20px -4px rgba(30, 27, 24, 0.04);
            border: 1px solid rgba(233, 225, 220, 0.5);
            transition: transform 0.2s cubic-bezier(0.175, 0.885, 0.32, 1.275), box-shadow 0.3s ease;
        }
        .recipe-card-shadow:active {
            transform: scale(0.98);
        }
        .glass-overlay {
            backdrop-filter: blur(20px);
            background: rgba(255, 248, 245, 0.7);
        }
        .custom-checkbox:checked + span {
            opacity: 0.4;
            text-decoration: line-through;
        }
        .line-clamp-2 {
            display: -webkit-box;
            -webkit-line-clamp: 2;
            -webkit-box-orient: vertical;
            overflow: hidden;
        }
        .tag-chip {
            background-color: #f5ece7;
            color: #434842;
            transition: all 0.2s;
        }
        .tag-chip-active {
            background-color: rgba(71, 97, 74, 0.12);
            color: #47614a;
        }
        /* Skeleton shimmer */
        .skeleton {
            background: linear-gradient(90deg, #f5ece7 25%, #efe6e2 50%, #f5ece7 75%);
            background-size: 200% 100%;
            animation: shimmer 1.5s infinite;
        }
        @keyframes shimmer {
            0% { background-position: 200% 0; }
            100% { background-position: -200% 0; }
        }
        /* Smooth transitions */
        .transition-transform-custom {
            transition: transform 0.2s cubic-bezier(0.175, 0.885, 0.32, 1.275);
        }
        .font-label-md {
            font-weight: 600;
            font-family: 'Plus Jakarta Sans', sans-serif;
        }
        .font-label-lg {
            font-weight: 700;
            font-family: 'Plus Jakarta Sans', sans-serif;
        }
        .font-headline-md {
            font-family: 'Newsreader', serif;
            font-weight: 500;
            font-size: 24px;
            line-height: 30px;
        }
        .font-headline-lg {
            font-family: 'Newsreader', serif;
            font-weight: 600;
            font-size: 32px;
            line-height: 38px;
        }
        .font-headline-xl {
            font-family: 'Newsreader', serif;
            font-weight: 600;
            font-size: 40px;
            line-height: 48px;
        }
