.mvc-container:where(.astro-lwdspi6t){max-width:1200px;margin:0 auto;padding:20px;font-family:system-ui,-apple-system,sans-serif}.mvc-container:where(.astro-lwdspi6t) h3:where(.astro-lwdspi6t){color:#1f2937;margin-bottom:10px}.mvc-container:where(.astro-lwdspi6t) p:where(.astro-lwdspi6t){color:#6b7280;margin-bottom:20px;line-height:1.6}.mvc-diagram:where(.astro-lwdspi6t){display:block;margin:0 auto 30px;background:#f9fafb;border:1px solid #e5e7eb;border-radius:8px;padding:20px;max-width:100%;height:auto;transform:scale(1);transform-origin:center;transition:transform .3s ease}.fb-fullscreen__overlay:where(.astro-lwdspi6t) .mvc-container:where(.astro-lwdspi6t){max-width:90vw;width:90vw}@media(max-width:768px){.fb-fullscreen__overlay:where(.astro-lwdspi6t) .mvc-container:where(.astro-lwdspi6t){max-width:95vw;width:95vw}}@media(prefers-color-scheme:dark){.mvc-container:where(.astro-lwdspi6t) h3:where(.astro-lwdspi6t){color:#f9fafb}.mvc-container:where(.astro-lwdspi6t) p:where(.astro-lwdspi6t){color:#d1d5db}.step-explanation:where(.astro-lwdspi6t) h4:where(.astro-lwdspi6t),.benefits:where(.astro-lwdspi6t) h4:where(.astro-lwdspi6t){color:#f9fafb}.step-explanation:where(.astro-lwdspi6t) li:where(.astro-lwdspi6t),.benefits:where(.astro-lwdspi6t) li:where(.astro-lwdspi6t){color:#e5e7eb}}html[data-theme=dark] .mvc-container:where(.astro-lwdspi6t) h3:where(.astro-lwdspi6t){color:#f9fafb}html[data-theme=dark] .mvc-container:where(.astro-lwdspi6t) p:where(.astro-lwdspi6t){color:#d1d5db}html[data-theme=dark] .step-explanation:where(.astro-lwdspi6t) h4:where(.astro-lwdspi6t),html[data-theme=dark] .benefits:where(.astro-lwdspi6t) h4:where(.astro-lwdspi6t){color:#f9fafb}html[data-theme=dark] .step-explanation:where(.astro-lwdspi6t) li:where(.astro-lwdspi6t),html[data-theme=dark] .benefits:where(.astro-lwdspi6t) li:where(.astro-lwdspi6t){color:#e5e7eb}.mvc-diagram:where(.astro-lwdspi6t) line:where(.astro-lwdspi6t){stroke-dasharray:200;stroke-dashoffset:200;animation:drawLoop 7s infinite}.mvc-diagram:where(.astro-lwdspi6t) .view-to-controller:where(.astro-lwdspi6t){animation-delay:.5s}.mvc-diagram:where(.astro-lwdspi6t) .controller-to-model:where(.astro-lwdspi6t){animation-delay:2s}.mvc-diagram:where(.astro-lwdspi6t) .model-to-controller:where(.astro-lwdspi6t){animation-delay:3.5s}.mvc-diagram:where(.astro-lwdspi6t) .controller-to-view:where(.astro-lwdspi6t){animation-delay:5s}.component-box:where(.astro-lwdspi6t){filter:drop-shadow(2px 2px 4px rgba(0,0,0,.2))}.step:where(.astro-lwdspi6t){opacity:0;animation:fadeInLoop 7s infinite}.step-1:where(.astro-lwdspi6t){animation-delay:0s}.step-2:where(.astro-lwdspi6t){animation-delay:1.5s}.step-3:where(.astro-lwdspi6t){animation-delay:3s}.step-4:where(.astro-lwdspi6t){animation-delay:4.5s}.arrow-label:where(.astro-lwdspi6t){opacity:0;animation:fadeInLoop 7s infinite}.arrow-sublabel:where(.astro-lwdspi6t){opacity:0;fill:#6b7280;animation:fadeInLoop 7s infinite}.view-to-controller:where(.astro-lwdspi6t)+.arrow-label:where(.astro-lwdspi6t),.view-to-controller:where(.astro-lwdspi6t)+.arrow-label:where(.astro-lwdspi6t)+.arrow-sublabel:where(.astro-lwdspi6t){animation-delay:1s}.controller-to-model:where(.astro-lwdspi6t)+.arrow-label:where(.astro-lwdspi6t),.controller-to-model:where(.astro-lwdspi6t)+.arrow-label:where(.astro-lwdspi6t)+.arrow-sublabel:where(.astro-lwdspi6t){animation-delay:2.5s}.model-to-controller:where(.astro-lwdspi6t)+.arrow-label:where(.astro-lwdspi6t),.model-to-controller:where(.astro-lwdspi6t)+.arrow-label:where(.astro-lwdspi6t)+.arrow-sublabel:where(.astro-lwdspi6t){animation-delay:4s}.controller-to-view:where(.astro-lwdspi6t)+.arrow-label:where(.astro-lwdspi6t),.controller-to-view:where(.astro-lwdspi6t)+.arrow-label:where(.astro-lwdspi6t)+.arrow-sublabel:where(.astro-lwdspi6t){animation-delay:5.5s}.mvc-explanation:where(.astro-lwdspi6t){display:grid;grid-template-columns:1fr 1fr;gap:30px;margin-top:30px}.step-explanation:where(.astro-lwdspi6t) h4:where(.astro-lwdspi6t),.benefits:where(.astro-lwdspi6t) h4:where(.astro-lwdspi6t){color:#1f2937;margin-bottom:15px;border-bottom:2px solid #3b82f6;padding-bottom:8px}.step-explanation:where(.astro-lwdspi6t) ol:where(.astro-lwdspi6t){padding-left:20px}.step-explanation:where(.astro-lwdspi6t) li:where(.astro-lwdspi6t){margin-bottom:12px;line-height:1.6;color:#374151}.benefits:where(.astro-lwdspi6t) ul:where(.astro-lwdspi6t){list-style:none;padding-left:0}.benefits:where(.astro-lwdspi6t) li:where(.astro-lwdspi6t){margin-bottom:12px;padding-left:20px;position:relative;line-height:1.6;color:#374151}.benefits:where(.astro-lwdspi6t) li:where(.astro-lwdspi6t):before{content:"✓";position:absolute;left:0;color:#10b981;font-weight:700}@keyframes drawLoop{0%{stroke-dashoffset:200}28.6%{stroke-dashoffset:0}85.7%{stroke-dashoffset:0}to{stroke-dashoffset:200}}@keyframes fadeInLoop{0%{opacity:0}28.6%{opacity:1}85.7%{opacity:1}to{opacity:0}}@media(max-width:768px){.mvc-container:where(.astro-lwdspi6t){padding:15px}.mvc-diagram:where(.astro-lwdspi6t){width:100%;height:auto}.desktop-layout:where(.astro-lwdspi6t){display:none!important}.mobile-layout:where(.astro-lwdspi6t){display:block!important}.mvc-explanation:where(.astro-lwdspi6t){grid-template-columns:1fr;gap:20px}.mvc-explanation:where(.astro-lwdspi6t) h4:where(.astro-lwdspi6t){font-size:16px}.step-explanation:where(.astro-lwdspi6t) li:where(.astro-lwdspi6t),.benefits:where(.astro-lwdspi6t) li:where(.astro-lwdspi6t){font-size:14px;margin-bottom:10px}}