body {
    font-family: 'Inter', sans-serif;
}

/* Animasi dan elemen SVG */
@keyframes peristalsis-wave {
    0% { stroke-dashoffset: 0; }
    100% { stroke-dashoffset: -100; }
}

.colon-wall { fill: #FECACA; stroke: #F87171; stroke-width: 2; }
.epithelium { fill: #FBCFE8; }
.blood-vessel { fill: #BFDBFE; }
.enteric-nerve { fill: none; stroke: #FBBF24; stroke-width: 1; stroke-linecap: round; stroke-linejoin: round; }

.bulk-particle { fill: #166534; opacity: 0; }
.osmotic-particle { fill: #1E40AF; opacity: 0; }
.water-particle { fill: #3B82F6; opacity: 0; }
.stool { fill: #A16207; opacity: 0; }

#intestine-path {
    fill: none;
    stroke: #FBCFE8;
    stroke-width: 12;
    stroke-linecap: round;
}

#peristalsis-overlay {
    fill: none;
    stroke: #F87171;
    stroke-width: 13;
    stroke-linecap: round;
    stroke-dasharray: 50 50;
    animation: peristalsis-wave linear infinite;
}

.peristalsis-kontrol { animation-duration: 12s; }
.peristalsis-slow { animation-duration: 8s; }
.peristalsis-medium { animation-duration: 5s; }
.peristalsis-fast { animation-duration: 2s; }

#norit-marker {
    fill: #111827;
    stroke: #4B5563;
    stroke-width: 1;
}

/* Tab aktif */
.sub-tab-btn {
    transition: all 0.2s ease-in-out;
}
.sub-tab-btn.active {
    border-bottom-width: 3px;
    font-weight: 600;
}